我想用JQuery实现垂直幻灯片放映。我正在使用一个垂直的卷轴(div),依次包含图像一个接一个我递减的卷轴顶部位置的图像大小每2秒这是工作正常,但是当我到达最后一个图像我无法实现从第一张图像开始卷轴的逻辑。如果我的解释是不清楚我正在追加我的代码:JQuery幻灯片的逻辑
<script type="text/javascript">
$(function() {
setInterval(SlideImage, 2000);
});
function SlideImage() {
$("#imgReel").animate({ "marginTop": "-=300px" }, 1000, function() { });
}
</script>
<style type="text/css">
img
{
width: 600px;
height: 300px;
}
.imgContainer
{
overflow: hidden;
width: 620px !important;
height: 300px !important;
}
div
{
width: 620px;
}
.current
{
z-index: 0;
}
.next
{
z-index: 1;
}
.imgReel
{
width: 620px !important;
}
.
</style>
<body>
<div id="imgContainer" class="imgContainer">
<div id="imgReel" class="imgReel">
<div class="current">
<img src="Images/Summerwave.jpg" />
</div>
<div>
<img src="Images/Sunlight_and_the_Wild_Forest_Floor.jpg" />
</div>
<div>
<img src="Images/Sunset.jpg" />
</div>
<div>
<img src="Images/Swimming_with_the_fishys.jpg" />
</div>
<div>
<img src="Images/Tearing_Apart.jpg" />
</div>
<div>
<img src="Images/Teaser.jpg" />
</div>
<div>
<img src="Images/Terra_Nova.jpg" />
</div>
</div>
</div>
任何帮助,将不胜感激