Marquee without scroll delay

Posted by Sugi under ASP.NET on 4/9/2014 | Points: 10 | Views : 2497 | Status : [Member] | Replies : 3
Marquee without scroll delay only in page load for the first time ..how to do?




Responses

Posted by: Allemahesh on: 4/9/2014 [Member] [MVP] Silver | Points: 25

Up
0
Down
You can use it as :

<div style="width: 1024px; background-color: #FFFF00;">
<marquee direction="left"><strong>Left Direction</strong></marquee>
</div>
<div style="width: 1024px; background-color: #CCFFCC;">
<marquee direction="right"><strong> Right Direction</strong></marquee>
</div>


Try these links:-

http://www.tutorialspoint.com/html/html_marquees.htm
http://www.quackit.com/html/codes/html_marquee_code.cfm
http://www.html.am/html-codes/marquees/

Happy coding.

Sugi, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: A2H on: 4/9/2014 [Member] [MVP] Silver | Points: 25

Up
0
Down
Hi,
As an alternative solution You can try the JQuery based Marquee solution which will run with out any delay.

Sample Implementation Code:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Scroll Text</title>

<style type="text/css">
.scroll{
width:430px;
height:21px;
overflow:hidden;
position:relative;
}

.scrollingtext{
white-space:nowrap;
position:absolute;
}

</style>
<script type="text/javascript">
$(document).ready(function() {

$('.scrollingtext').bind('marquee', function() {
var ob = $(this);
var tw = ob.width();
var ww = ob.parent().width();
ob.css({ right: -tw });
ob.animate({ right: ww }, 20000, 'linear', function() {
ob.trigger('marquee');
});
}).trigger('marquee');

});
</script>
</head>
<body>
<div class="scroll">
<div class="scrollingtext"> Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
</div>
</div>
</body>
</html>


You can find a Sample Working demo of above code in below link
http://jsbin.com/tiqociwa/2/edit

Source URL : http://blog.codez.in/scrolling-text-content-using-jquery-and-not-using-marquee/jquery/2011/01/06

Thanks,
A2H
My Blog

Sugi, if this helps please login to Mark As Answer. | Alert Moderator

Posted by: A2H on: 4/9/2014 [Member] [MVP] Silver | Points: 25

Up
0
Down
Another option is to use the below Jquery Marquee PlugIn : The Silky Smooth Marquee
Refer the below link for more details on that
http://remysharp.com/2008/09/10/the-silky-smooth-marquee/
Demo of The Silky Smooth Marquee Plugin
http://remysharp.com/demo/marquee.html

Thanks,
A2H
My Blog

Sugi, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response