Javascript 如何使用JQuery和CSS实现垂直旋转新闻滑块?

Javascript 如何使用JQuery和CSS实现垂直旋转新闻滑块?,javascript,jquery,css,twitter-bootstrap,Javascript,Jquery,Css,Twitter Bootstrap,我想使用jQuery和CSS创建一个垂直滑块。这是我的密码: HTML和JavaScript <script> $.fn.cycle.defaults.autoSelector = '.slideshow'; </script> <div class="slideshow vertical" data-cycle-fx=carousel data-cycle-timeout=0 data-cycle-next="#next3" data-cycle-prev

我想使用jQuery和CSS创建一个垂直滑块。这是我的密码:

HTML和JavaScript

<script>
    $.fn.cycle.defaults.autoSelector = '.slideshow';
</script>
<div class="slideshow vertical" data-cycle-fx=carousel data-cycle-timeout=0 data-cycle-next="#next3" data-cycle-prev="#prev3" data-cycle-carousel-visible=2 data-cycle-carousel-vertical=true>
    <img src="http://malsup.github.io/images/beach1.jpg">
    <img src="http://malsup.github.io/images/beach2.jpg">
    <img src="http://malsup.github.io/images/beach3.jpg">
    <img src="http://malsup.github.io/images/beach4.jpg">
    <img src="http://malsup.github.io/images/beach5.jpg">
    <img src="http://malsup.github.io/images/beach9.jpg">
</div>
<div class="center">
    <button id="prev3">∧ Prev</button>
    <button id="next3">∨ Next</button>
</div>

然而,它只显示了两幅图像。我想展示3到4张图片

我也有一个,但它只显示一个滑块文本。
如何更改并将其设置为2到3?

如果您将高度设置为
。slideshow
设置为
312px
这应该可以完成工作。 看


甚至更简单的方法是,将
数据循环转盘visible=X
设置为所需的图片数量X。例如,
数据循环转盘可见=3

另一个链接已修复,伙计。尝试学习如何正确设置代码格式,并提出一个好问题:为什么它不会自动移动?因为
数据周期超时设置为零。输入所需速度的数字(较大的数字表示图像在更改之前停留的时间较长)。类似于
数据周期超时=1000
.slideshow {
    margin: auto;
    position: relative;
    overflow: hidden;
    height: 200px;
}
.slideshow img {
    width: 100px;
    height: 100px;
    padding: 2px;
}
div.responsive img {
    width: auto;
    height: auto
}
.cycle-pager {
    position: static;
    margin-top: 5px
}