我在以下测试页面上使用 Flexslider(旧版本 1.0，支持 jquery 1.4.8):http://www.showstyle.lu/service/startv2/
如您所见， slider 是在左上角和右下角的图像(在内容的上部)上实现的。当我通过 Dreamweaver 离线测试时，没有出现卡顿效果或滞后效果，但在 chrome/firefox/opera 中，淡入淡出效果开始出现，但随后以一种非常尴尬的方式冲入下一张幻灯片。
它看起来不平滑，在 IE 中它根本不褪色但是没关系，毕竟是 IE(rip IE)
我查看了 Stackoverflow，谷歌上的很多页面都提到这是一个主要在 Firefox 中与 float 相关的问题，在 Chrome 中出现的次数并不多。
我查看了我的 slider 并检查了它们并取消了 css 中的各种类以查看它是否会影响 slider 的流动性但到目前为止运气不好所以我无法真正查明干扰 slider 的代码。
有处理这方面的经验吗？
提前致谢!
最佳答案
我不确定这是否有帮助，但在您的 style.css 中，您有这段用于 slider 过渡的代码:
* {
-moz-transition: color 0.3s ease;
-webkit-transition: color 0.3s ease;
transition: color 0.3s ease;
transition: opacity .25s ease-in-out; */
-moz-transition: opacity .25s ease-in-out;
-webkit-transition: opacity 3s ease-in-out; */
通过删除底部的 3 个属性，我能够在您的 slider 上获得更平滑的过渡很多(通过检查元素和编辑 CSS 做到这一点)。因此，如果您的 CSS 的这一部分是这样的:
* {
-moz-transition: color 0.3s ease;
-webkit-transition: color 0.3s ease;
transition: color 0.3s ease;
我认为您会得到您正在寻找的更平稳的过渡。 (这是在 Chrome 中完成的，尚未测试其他浏览器)。
关于javascript - FlexSlider 卡顿/淡入淡出滞后，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34272362/