帮助语法调用自动播放的jQuery函数

时间:2011-08-16 19:01:14

标签: jquery slider autoplay

如何使此滑块自动播放?

以下是答案:

    <div class="slideshow"><ul> 
          <li><img src="lemons/1.jpg" alt="lemon" /></li>
          <li><img src="lemons/2.jpg" alt="lemon tea" /></li>
          <li><img src="lemons/3.jpg" alt="splashing lemon" /></li>
    </ul></div> 

    <script type="text/javascript">
        $(window).load(function () {
            // start the slideshow
            $('.slideshow').blinds();

        var i = 0;
        var j = 4; // this is hardcorded, one more than total images  
                   // if you have a way of making j dynamic, please share
        setInterval( function(){
            if (i == j)
                {
                    i = 1;
                    $('.slideshow').blinds_change(i);
                    i++;                        
                } else {
                    $('.slideshow').blinds_change(i);
                    i++;                        
                }
        } , 3000 );
        })
    </script>

这是原始脚本的摘录(使用在IE 8,7,6等中工作的jQueryBlinds:http://www.littlewebthings.com/projects/blinds/):

    <div class="slideshow"><ul> 
          <li><img src="lemons/1.jpg" alt="lemon" /></li>
          <li><img src="lemons/2.jpg" alt="lemon tea" /></li>
          <li><img src="lemons/3.jpg" alt="splashing lemon" /></li>
    </ul></div> 

    <!-- change image links -->
    <a href="#" class="change_link" onclick="$('.slideshow').blinds_change(0)">1</a>
    <a href="#" class="change_link" onclick="$('.slideshow').blinds_change(1)">2</a>
    <a href="#" class="change_link" onclick="$('.slideshow').blinds_change(2)">3</a>

    <script type="text/javascript">
        $(window).load(function () {
            // start the slideshow
            $('.slideshow').blinds();
        })
    </script>

2 个答案:

答案 0 :(得分:1)

要使j动态,您可以:  。$( '#sldeshow')的儿童( 'UL')的大小();

答案 1 :(得分:0)

要设置定时事件,您可以使用setTimeout()

http://www.w3schools.com/js/js_timing.asp