我想用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>
任何幫助,將不勝感激