javascript - HTML/JS : Scroll to Top Visual Artifact

Question

http://daniel.concept9.ca/ - 正如您所看到的，非常基本的网站 - 问题是每次我向下滚动(我低于顶部)然后点击菜单中的“关于”时，它会让我打开并打开部分仅 在显示整页视觉伪影 1-2 秒后。

我认为这可能与我在加载页面后立即进入控制台的错误有关:“Uncaught TypeError: Cannot read property 'top' of undefinedglobal.min.js:42 (匿名函数)” ...但我在 JS 中的 n00b ...

如有任何帮助，我们将不胜感激!

谢谢! 丹.

Answer 1

单击“关于”时，站点:

1. 滚动到顶部
2. 将标题位置从“固定”切换到“绝对”
3. 对“关于”部分进行 3D 翻译
4. 移动标题

据我所知，它会尝试同时执行所有这些操作。那里有一些计算量大的函数，本质上涉及尝试在 javascript 滚动时重新呈现整个页面。

此外，页面底部包含大约 25 个 javascript 文件(主要是 jQuery 插件)，其中大部分可能会在一定程度上减慢页面速度。这就是购买漂亮的商业主题的危险所在 - jQuery 插件使页面看起来很棒，主题创建者只需进行少量开发工作，但页面性能会受到影响。

有很多方法可以提高此操作的性能并消除渲染瑕疵，但可能没有什么快速简便的方法。最简单的方法可能是确保首先发生滚动并在回调函数中显示“关于” Pane 。不幸的是，大部分 JS 都被模糊化/缩小了，因此很难准确解释要做什么。