我正在使用视差将 Wordpress 主题调整为我为事件开发的 Logo 。
基本上,我只是用新 Logo 的不透明层替换了原始元素,然后将它们重新定位为直接层叠在一起。问题是,在我完成此操作后,页面加载时 Logo 的放置或显示与注册滚动事件后不同。
我对视差或 javascript 的经验很少。该网站位于 http://www.foodprint.se我在 chrome 中遇到的控制台错误是:
body.scrollTop is deprecated in strict mode. Please use 'documentElement.scrollTop' if in strict mode and 'body.scrollTop' only if in quirks mode. jquery.js:4 body.scrollLeft is deprecated in strict mode. Please use 'documentElement.scrollLeft' if in strict mode and 'body.scrollLeft' only if in quirks mode. jquery.js:4 Object {type: "refresh", state: Object} state: Object type: "refresh" proto: Object script.js:192 event.returnValue is deprecated. Please use the standard event.preventDefault() instead. jquery.js:3 Object {type: "refresh", state: Object} state: Object type: "refresh" proto: Object
如果有任何提示可以让我朝着正确的方向前进,我将不胜感激。
最佳答案
您面临的问题是 chrome
的一般问题......它使用 body.scrollTop
来表示标准模式下视口(viewport)的滚动位置。
我能想到的可能原因是 chrome
的制造商希望开发人员切换到更正式或通用的编码风格......至于其他浏览器,如 Mozilla,我不认为您的问题就在那里(您是否也在其他浏览器中检查过!!?在我的 mozilla 上看起来不错:))
可以查看 this Git 如果有帮助,请修复!!!
此外,如果可以使用 jquery, see this link , 它显示等效于 body.scrollTop
编辑
在你的文件 layout.css
您已为 #header
设置了 margin: 700px 0 0 0;
.....这导致页面仅在滚动后呈现下拉...将 700px
更改为 0px
现在,要在放置后放置内容,将同一文件中的 #header .content
部分修改为以下:
#header .content {
margin: 700px 0 20px 0; /* previously it was 0 0 20px 0 */
line-height: 18px;
z-index: 4;
}
关于javascript - 带有视差的页面加载位置奇怪,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20682227/