Firefox和IE再次失败帮助我的代码跨浏览器吗？ jQuery自动滚动

Question

我在让此功能在IE和Firefox中无法正常工作时遇到问题，它只能在chrome中使用……是页面自动从上到下滚动，然后一次又一次地用2个按钮来回滚动，以停止“动画” “，然后再重新开始。无论如何，IV也在问题的底部附加了一个实时链接。

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>

jQuery：

$("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();
});

实时示例仅适用于Chrome！ 不是Firefox或IE浏览器。 范例连结

Answer 1

还要滚动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出现问题）。