0

我无法让它在 IE 和 Firefox 中工作，它只适用于 chrome 它是什么......页面是否自动从上到下滚动，然后用 2 个按钮一次又一次地返回以停止“动画” ” 和另一个重新开始.. 不管怎样，我还在问题的底部附加了一个实时链接..

HTML：

<div id="Stage_About" class="Stage_About_id" style="position: absolute; margin: 0px; left: 0px; top: 2248px; width: 100%; height: 1169px; right: auto; bottom: auto; background-size: 100%; background-image: url(http://www.hd-wallpapers.com/download/blue-background_1600x1200_224-standard.jpg); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); background-position: 0px 0px; background-repeat: no-repeat no-repeat;"></div>

<div id="Stage_Hello" class="Stage_Hello_id" style="position: absolute; margin: 0px; left: 0px; top: 685px; width: 100%; height: 982px; right: auto; bottom: auto; background-size: 100%; background-image: url(http://www.wallgc.com/images/2013/01/black-windows-7-psdgraphics.jpg); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); background-position: 0px 0px; background-repeat: no-repeat no-repeat;"></div>

<div id="Stage_play" class="Stage_play_id" style="position: fixed; margin: 0px; left: 4%; top: 78px; width: 218px; height: 104px; right: auto; bottom: auto; border: 0px none rgb(0, 0, 0); background-color: rgb(0, 0, 0); -webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></div>

<div id="Stage_stop" class="Stage_stop_id" style="position: fixed; margin: 0px; left: 79.3%; top: 78px; width: 208px; height: 88px; right: auto; bottom: auto; border: 0px none rgb(0, 0, 0); background-color: rgb(98, 98, 98); -webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></div>

<div style="height:2000px; float:left; width:100%;">
TEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXTTEXT 
TEXT
TEXT
TEXT

</div>

查询：

$("body").append($("#Stage_stop").css("position", "fixed"));
$("body").append($("#Stage_play").css("position", "fixed"));

function updown(){
  var bottom = $(document).height()-$(window).height();
  $('body')
    .animate({scrollTop:bottom},20000)
    .animate({scrollTop:0},2000,updown);
}
updown();

/* Stop animation */
$("#Stage_stop").click(function(){
    $('body').stop(true);
});

/* Start animation */
$("#Stage_play").click(function(){
    updown();
});

Live Example 仅适用于 Chrome！不是火狐或IE。 示例链接

4

1 回答 1

0

滚动 HTML 元素：

  $('html, body')
    .animate({scrollTop:3000},20000)
    .animate({scrollTop:0},2000,updown);

并且

 $('html, body').stop(true);

按钮上。

更新小提琴： http: //jsfiddle.net/CsqGr/5/ （另请注意，我将 jquery 更改为 edge，因为 1.10.1 中存在导致 IE 10 出现问题的错误）。

于 2013-08-16T16:18:40.757 回答