2

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

HTMLピースは

<!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>

そしてここに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"));

});

実行中にしばらく停止してから再び実行されます。修正方法を知っていますか?

4

1 に答える 1

1
var reset = function() {
    $(this).css("margin-top", "100%");
    $(this).animate({ "margin-top": "0%" }, 5000, 'linear', reset);
};
于 2012-08-28T09:03:47.100 に答える