简体   繁体   中英

This script stops while running

http://jsbin.com/uyawi/1879/edit

THe html piece is

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
<head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

<style type="text/css">
</style>

</head>
<body>


  <div id="marquee"><p>My scrolling text is so freakin' COOL!!!111!</p><p>My scrolling text is so freakin' COOL!!!111!</p
<p>My scrolling text is so freakin' COOL!!!111!</p</div>


</body>
</html>

and here is the javascript

$(function() {

    var marquee = $("#marquee"); 
    marquee.css({"overflow": "hidden", "height": "100%"});

    // wrap "My Text" with a span (IE doesn't like divs inline-block)
    marquee.wrapInner("<span>");
    marquee.find("span").css({ "height": "100%", "display": "inline-block", "text-align":"center" }); 
   marquee.append(marquee.find("span").clone()); // now there are two spans with "My Text"    
    marquee.wrapInner("<div>");
    marquee.find("div").css("height", "100%");    
    var reset = function() {
        $(this).css("margin-top", "100%");
        $(this).animate({ "margin-top": "-100%" }, 5000, 'linear', reset);
    };    
    reset.call(marquee.find("div"));

});

It stops a while while running and then runs again, do you know how to fix it ?

var reset = function() {
    $(this).css("margin-top", "100%");
    $(this).animate({ "margin-top": "0%" }, 5000, 'linear', reset);
};

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM