0

我正在使用用于图像滑块的 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>

脚本

<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>
4

1 回答 1

0

您可以通过回调函数停止轮播。在上面的例子中，你可以这样做：

$('#slider-main').tinycarousel({
    callback: function(element, index){
        if (index == 4) {
          $('#slider-main').tinycarousel_stop();
        }
    }
});
于 2013-06-04T21:17:13.023 回答