如何正确地滚动IFrame的JavaScript中底(How to properly scroll

对于用于在网站上的互动研究样机的网页时，我使用JavaScript创建了一个样机消息流。 此消息流被装入一个IFrame和应在预先设定的时间间隔显示的图像和在所述页的底部放置新图像之后滚动到页面的底部。 获取的图像出现与所提供的脚本合作得非常好。 然而，无论是Chrome和IE似乎有麻烦滚动页面的底部。 我想只要图像附加滚动到页面的底部，但现在增加了5毫秒的延迟，因为这似乎有时工作。 我的问题是：

• 它是怎么运用document.body.scrollHeight为了这个目的？
• 我可以滚动出现直接，还是我滚动前需要一个小的区间？
• 如何使代码滚动到iframe的底部添加图像后直接？

以下功能的使用和trypost（）启动的onLoad：

function scrollToBottom(){
  window.scrollBy(0,document.body.scrollHeight);
}

function trypost(){
  point = point + 1;
  if(point < interval.length){
    //create and append a new image
    var newImg = document.createElement("IMG");
    newImg.src = "images/"+images[point]+".png";
    document.getElementById('holder').appendChild(newImg);
    //create and append a return
    var br = document.createElement("br");
    document.getElementById('holder').appendChild(br);
    //time scroll to bottom (after an arbitrary 5 seconds)
    var stb = window.setTimeout(scrollToBottom, 5);
    //time next post
    var nextupdate = interval[point]*400;
    var tp = window.setTimeout(trypost, nextupdate);
  }
}

我的脚本部分至少包含以下变量：

var point = -1;
var interval = [10, 10, 15];
var images = ["r1", "a1", "r2"];

这个问题是该项目的延续中描述的如何正确使用的setTimeout与IE浏览器？

Answer 1:

滚动到下总是喜欢滚动到一些大的离谱顶偏，如999999 。

iframe.contentWindow.scrollTo( 0, 999999 );

另外看到这个帖子： 滚动使用JavaScript的iframe？

如果太早发生滚动，它可能是由于没有尚未加载的图像。 因此，你将不得不为增加图像已经被加载，而不是已经把它尽快滚动。 加

newImg.onload = function() { triggerScrolling(); };

创建后newImg ，但在此之前转让财产src 。

如果需要多个事件来触发滚动，你可能需要使用一些“事件收集器”。

function getEventCollector( start, trigger ) {
    return function() {
        if ( --start == 0 ) { trigger(); )
    };
}

然后，您可以使用它像这样：

var collector = getEventCollector( 2, function() { triggerScrolling(); } );
newImg.onload = collector;
window.setTimeout( collector, 100 );

这样triggerScrolling()被调用100ms的图像已经被加载为至少和后后collector具有用于triggerScrolling被调用两次（）被调用最终。

文章来源: How to properly scroll IFrame to bottom in javascript