Javascript jQuery视差滞后于罗马和Safari

Javascript jQuery视差滞后于罗马和Safari,javascript,jquery,google-chrome,scroll,parallax,Javascript,Jquery,Google Chrome,Scroll,Parallax,我的视差效果在firefox中效果很好,但在chrome和safari中效果不好。下面是一个描述我的页面结构的示例 我的HTML <article> <div class="thumbnail-container"> <img src="http://placehold.it/300x200&text=thumbnail"/> </div> Lorem ipsum dolor sit amet, c

我的视差效果在firefox中效果很好,但在chrome和safari中效果不好。下面是一个描述我的页面结构的示例

我的HTML

<article>
    <div class="thumbnail-container">
        <img src="http://placehold.it/300x200&text=thumbnail"/>
    </div>

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sit amet leo non erat aliquam pellentesque. Duis et dictum velit. Curabitur blandit odio quis luctus ultrices. Maecenas venenatis erat in eros feugiat imperdiet. Duis ultricies nulla quis eros eleifend sagittis.
</article>
<article>
    <div class="thumbnail-container">
        <img src="http://placehold.it/300x200&text=thumbnail"/>
    </div>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sit amet leo non erat aliquam pellentesque. Duis et dictum velit. Curabitur blandit odio quis luctus ultrices. Maecenas venenatis erat in eros feugiat imperdiet. Duis ultricies nulla quis eros eleifend sagittis.
</article>
<article>
    <div class="thumbnail-container">
        <img src="http://placehold.it/300x200&text=thumbnail"/>
    </div>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sit amet leo non erat aliquam pellentesque. Duis et dictum velit. Curabitur blandit odio quis luctus ultrices. Maecenas venenatis erat in eros feugiat imperdiet. Duis ultricies nulla quis eros eleifend sagittis.
</article>
<article>
    <div class="thumbnail-container">
        <img src="http://placehold.it/300x200&text=thumbnail"/>
    </div>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sit amet leo non erat aliquam pellentesque. Duis et dictum velit. Curabitur blandit odio quis luctus ultrices. Maecenas venenatis erat in eros feugiat imperdiet. Duis ultricies nulla quis eros eleifend sagittis.
</article>
<article>
    <div class="thumbnail-container">
        <img src="http://placehold.it/300x200&text=thumbnail"/>
    </div>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris sit amet leo non erat aliquam pellentesque. Duis et dictum velit. Curabitur blandit odio quis luctus ultrices. Maecenas venenatis erat in eros feugiat imperdiet. Duis ultricies nulla quis eros eleifend sagittis.
</article>
还有我的CSS

article{
    width:100%;
    text-align:justify;
}
.thumbnail-container{
  position: relative;
  height: 350px;
  overflow: hidden;
 }

.thumbnail-container img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
}
问题在哪里


谢谢

问题在于鼠标滚动不顺畅。覆盖默认的鼠标滚动

你说“不好用”是什么意思?谷歌chrome和safari上的scroll出现了故障。“故障”是什么意思?我正在用铬合金操作你的小提琴,它看起来很好。我想我看到了。你的意思是当你快速滚动时棋盘格的纹理吗?如果是这样的话,在不改变视差处理方式的情况下,你可能无法做任何事情,想想看:我认为他指的是一个起伏的动画,而不是平滑的。
article{
    width:100%;
    text-align:justify;
}
.thumbnail-container{
  position: relative;
  height: 350px;
  overflow: hidden;
 }

.thumbnail-container img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
}