Bx Slider使页面上的其他元素移动（在Chrome上）

Question

我在2个网站上发现了错误：如标题中所述，当幻灯片正在运行时，页面中的某些元素会同时移动。查看此页面：

http://www.cosmosupplylab.com/

向页面向下滚动到Team部分，一些肖像在滑块被触发的同时移动。 它也发生在专业知识部分和页面上的其他位置（一些图片，一个段落中的一个单词，一些div ...）

这是一个非常奇怪的行为，如果你对可能的原因有所了解，非常感谢！

Answer 1

我在谷歌浏览器中有相同的行为，并通过在我的CSS中添加以下内容来修复它。

.bx-viewport {
    -webkit-transform: translatez(0);
    -moz-transform: translatez(0);
    -ms-transform: translatez(0);
    -o-transform: translatez(0);
    transform: translatez(0);
}

Answer 2

我不知道原因，但我刚遇到同样的问题。

我注意到所有受影响的元素都位于“相对”位置，因此我尝试更改它们。我试过绝对，它修复了问题，但与我的设计相冲突。

我通过使所有受影响的元素定位来解决它：静态。

*受影响的浮动元素仍在移动，我建议如果它们是单浮动元素则使它们成为绝对值。 ：d

Answer 3

对于遇到此问题的其他人，我有一个“解决方案”。

跳跃元素是浏览器使用CSS动画的结果。

要快速停止此行为，请将“useCSS”选项设置为false。

我不喜欢这样建议，因为我更喜欢CSS动画 - 但它确实有效。