私はイメージ スライダー用の tinycarousel jquery プラグインを使用しています。最後のスライドに到達したら自動的に一時停止したいと思います。jquery または JavaScript はまったく初めてです。 . 前もって感謝します。
HTML:
<div id="slider-main">
<a class="buttons prev" href="#">left</a>
<div class="viewport">
<ul class="overview">
<li><img src="images/image1.jpg" /></li>
<li><img src="images/image2.jpg" /></li>
<li><img src="images/image3.jpg /></li>
<li><img src="images/image4.jpg" /></li>
<li><img src="images/image5.jpg" /></li>
</ul>
</div>
<a class="buttons next" href="#">right</a>
<ul class="pager">
<li><a rel="0" class="pagenum" href="#">1</a></li>
<li><a rel="1" class="pagenum" href="#">2</a></li>
<li><a rel="2" class="pagenum" href="#">3</a></li>
<li><a rel="3" class="pagenum" href="#">4</a></li>
<li><a rel="4" class="pagenum" href="#">5</a></li>
</ul>
</div>
JSCRIPT
<script type="text/javascript" src="lib/js/iepngfix_tilebg.js"></script>
<script type="text/javascript" src="lib/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="lib/js/jquery.tinycarousel.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#slider-main').tinycarousel({ pager: true, interval: true, intervaltime: 1000, duration:500 });
$('#slider-products').tinycarousel({ display: 3 });
$('#slider-main').tinycarousel({
callback: function(element, index){
if (index == 4) {
$('#slider-main').tinycarousel_stop();
}
}
});
});
</script>