微型旋转木马插件，最后一张幻灯片自动停止

Question

我正在用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>

Answer 1

您可以从回调函数中停止轮播。在上面的示例中，您可以这样做：

$('#slider-main').tinycarousel({
    callback: function(element, index){
        if (index == 4) {
          $('#slider-main').tinycarousel_stop();
        }
    }
});