Question

我正在尝试为我的网站制作幻灯片，但我不知道如何重新启动数组。我尝试在函数中放置一个for循环，但页面只显示每次重新加载时的最后一个图像。这是代码：

   var i=0;

    function myfunc(){
           console.log(i); 
           slideShowImage.src = images[i];
           console.log(slideShowImage.src);
           /**
           if (images[i] =="Mir.jpg"){
              link = document.getElementById("slideShowLink");
              link.href="http://stackoverflow.com";   
           }
        */
           i = i+1;
    }
setInterval(myfunc,5000);

Answer 1

听起来你希望uniqueWordCount = 0 helloString = ['hello', 'world', 'world', 'how', 'are', 'you', 'doing', 'today'] count = {} for word in helloString: if word in count : count[word] += 1 else: count[word] = 1 len(count) #=> 7在点击i中的最后一张图片后回绕到0。尝试将images替换为i，如下所示：

i % images.length

Answer 2

我认为您缺少功能的组件。我认为你需要添加到你的功能：

    var $next =  $active.next().length ? $active.next()
    : $('#slideshow IMG:first');

以下是我用来制作自己的幻灯片的代码：

    function slideSwitch() {
        var $active = $('#slideshow IMG.active');

        if ( $active.length == 0 ) $active = $('#slideshow IMG:last');

        var $next =  $active.next().length ? $active.next()
        : $('#slideshow IMG:first');

        $active.addClass('last-active');

        $next.css({opacity: 0.0})
       .addClass('active')
       .animate({opacity: 1.0}, 1000, function() {
        $active.removeClass('active last-active');
         });
        }

        $(function() {
        setInterval( "slideSwitch()", 5000 );
     });

该函数告诉它从哪里开始，最后，它需要回到第一个。然后将其合并到最后的setInternal中。

如果你需要，这是css：

    #slideshow {
        position:relative;
        height:350px;
    }

   #slideshow IMG {
       position:absolute;
       top:0;
       left:0;
       z-index:8;
   }

   #slideshow IMG.active {
      z-index:10;
  }

  #slideshow IMG.last-active {
      z-index:9;
  }

和html：

    <div id="slideshow">
      <img src="img/img1.jpg" alt="" class="active" />
      <img src="img/img2.jpg" alt="" />
      <img src="img/img3.jpg" alt="" />
    </div>

幻灯片不会重新启动

2 个答案: