我正在一个响应迅速的网站上工作。我试图实现一个包含内容的滑块,并且使用Cycle2是为了它的简单性。
我已将大部分内容放在一起,我遇到的一个问题是,在Cycle2滑块中,百分比宽度不能正常工作......
基本上我有一张宽度为100%的容器,另外两张是容器的50%,并排放置。你可以在我demo page制作的所有内容中看到这一切。但是还有一个codepen(尽管在这里看起来比较难,但代码是一样的。)
问题是,为了循环,Cycle2似乎与容器的宽度一起玩。这意味着我的所有图片也会受到影响,因为它们基于百分比宽度。如果你点击" next"您会看到动画看起来很奇怪,因为图片在消失之前会生成不同大小的动画。我希望一切都保持不变,但只需滚动即可。
我只是想知道你的解决方案是什么,我真的更喜欢使用Cycle2,因为我知道它很好很容易设计,但也许它不可能。或者在这种情况下你会如何处理响应式设计呢?
<div class="slider cycle-slideshow"
data-cycle-fx="scrollHorz"
data-cycle-pause-on-hover="false"
data-cycle-speed="400"
data-cycle-timeout=0
data-cycle-slides="> div.slideItem"
data-cycle-prev="#prev"
data-cycle-next="#next"
data-cycle-auto-height=true
>