滚动

时间:2016-04-10 23:14:10

标签: javascript html google-chrome web scroll

这是我正在处理的网站:Click here - Home Page Scroll Issue

我正在使用Foundation 5,一个粘性滚动条和Owl Carousel(我尝试使用Slick轮播,结果是一样的)。

我遇到的问题是,无论何时我向上/向下滚动并且顶部栏越过旋转木马,整个页面都会断断续续,滚动会突然停止,并且比预期的轨迹更短。

我尝试了很多解决方案,包括将z-index-webkit-transform: translateZ(0)规则应用于轮播,但没有成功。

这个问题在Firefox或Edge中似乎不存在,或者至少不那么明显。

有什么想法吗?

**更新,Ajay Varghese's回答似乎有助于向下滚动,但滚动时问题仍然存在。复制下一个内容行以增加页面长度时,如果您尝试向上滚动以显示轮播,则会跳转并创建滚动卡顿。这个问题非常烦人,我似乎无法找到原因。

1 个答案:

答案 0 :(得分:0)

此问题仅存在于Chrome中。问题似乎是WebKit有时不能很好地处理分层。

以下是适合我的解决方案: body { -webkit-transform: translate3d(0, 0, 0);}

希望这有助于某人并节省宝贵的时间。

**更新,我没有意识到这打破了粘性顶杆。因此,这种解决方案是不可行的。