Question

我在我的新网站上使用视差js（http://pixelcog.github.io/parallax.js/）。在五个地方，我使用这个，没有任何内容只有视差图像，它在所有浏览器中工作得非常好。

但是根据内容，在Firefox，IE和Safari浏览器中，视差并不顺畅。这似乎是在颠覆视差图像及其div内容。首先移动视差图像然后视差图像移动的内容。

这是我的视差设置的代码片段。

<section class="my-class parallax-window" data-parallax="scroll" data-image-src="img/my-image.jpg">
   <!-- my content going here... -->
</section>

.parallax-window { min-height: 400px; background: transparent; }

如何让所有浏览器顺利进行..？

Answer 1

请查看标题为github page的部分，＆＃34;对复杂内容使用内部HTML＆＃34;。这可能有所帮助。由于在滚动时显示了一些背景，我有顶部和底部边缘闪烁的问题，我用＆＃34; bleed＆＃34;选项，允许在顶部底部稍微重叠以隐藏毛刺。还有一个名为“#ScrollFix＆＃34; overScrollFix＆＃34;您可以将其设置为TRUE，这在某些浏览器中可能会有所帮助。

Answer 2

// To fix parallax jerky effects on IE Browsers  
    if (navigator.userAgent.match(/Trident\/7\./)) {  
        $('body').on("mousewheel", function () {  
            event.preventDefault();  
            var wd = event.wheelDelta;  
            var csp = window.pageYOffset;  
            window.scrollTo(0, csp - wd);  
        });  
    }

Parallax JS与Firefox，IE和Safari中的内容无法正常工作

2 个答案: