使用jQuery Cycle 2,如何显示下一张和上一张幻灯片的一部分

时间:2014-10-17 14:32:59

标签: jquery css jquery-cycle2

我一直在努力解决这个问题,并且已经看到了一些非常复杂的基于JavaScript的解决方案。我最终用最小的CSS解决方案破解了它(无论如何我的需要)。

1 个答案:

答案 0 :(得分:4)

基本上你移动"溢出:隐藏"从幻灯片元素到更宽的父元素,然后在幻灯片元素上设置左边距。

我已经为固定布局更新了JSFiddle: http://jsfiddle.net/mledwards34/x89sQ/5/

.slideshow-container {
    overflow: hidden !important;
    width: 300px;
}

.slideshow {
    overflow: visible !important;
    margin-left: 50px;
}

和响应式布局: http://jsfiddle.net/mledwards34/x89sQ/6/

.slideshow-container {
    overflow: hidden !important;
    width: 50%;
}

.slideshow {
    overflow: visible !important;
    width: 80%;
    margin-left: 10%;
}