0

我试图在浏览器完全加载并跳转到scrollBy函数中定义的滚动偏移位置后使页面显示在浏览器中。怎样才能达到这样的效果?

我在网上看到的大多数解决方案都是隐藏/显示“onload”上的元素。但是当使用偏移量时,我似乎无法让它工作。

例如,到目前为止,我已经尝试了几件事。在给出的示例代码中,在 scrollby 函数运行后将可见性值更改为可见。但是由于某种原因,scrollby 函数似乎总是最后运行,导致页面显示在顶部并立即跳转到偏移量。

我尝试过的其他变体是使用“显示:块”并使用覆盖整个页面的覆盖 div,稍后用 javascript 将其删除。但结果是一样的,scrollby 函数似乎总是最后运行 - 无论“goToByScroll”函数中的顺序如何。

function goToByScroll()
{
    window.scrollBy(0,300); // Jumps to specific offset

    document.getElementById("page").style.visibility="visible"; 
}
window.onload = goToByScroll;   
4

1 回答 1

0

您需要在设置滚动位置和应用新样式之间将控制权交还给浏览器。简单编辑:

function goToByScroll()
{
    window.scrollBy(0,300); // Jumps to specific offset

    setTimeout('document.getElementById("page").style.visibility="visible"', 0); 
}
window.onload = goToByScroll;

否则,浏览器应用 DOM 更改的顺序是不确定的。

在执行 JavaScript 代码时,浏览器不会对 DOM 应用更新;想象一下遍历一个大表,对每个单元格应用格式,作者通常会希望所有这些更改都立即出现。

浏览器仅在 JavaScript 空闲时(例如等待另一个事件)才对 DOM 应用更新。 setTimeout是延迟处理并允许浏览器应用到目前为止所做的任何更改的一种方法。

但是,setTimeout它将创建一个新的执行上下文,因此您将无法访问该函数的本地变量。理想情况下,您应该只使用 setTimeout 调用零参数函数,否则它只是另一个邪恶的eval声明:

function goToByScroll()
{
    window.scrollBy(0,300); // Jumps to specific offset
    setTimeout(showPage, 0);
}

function showPage()
{
    document.getElementById("page").style.visibility="visible"; 
}

window.onload = goToByScroll;
于 2012-10-16T11:49:37.190 回答