幻灯片放映幻灯片，其他幻灯片放映幻灯片

问题描述：

我目前正在使用显示和隐藏功能在一个jQuery幻灯片放映，并在一般情况下，它工作得很好。我无法弄清楚的是如何在第一张图像滑出的同时使图像滑入。它只是等待第一张图片滑出后再滑入下一张图片。我想要的是让图像在另一个图像滑出的同时滑动，并且不会让图像滑动而不得不等待第一个图像滑出。幻灯片放映幻灯片，其他幻灯片放映幻灯片

感觉就像我正在做misstake地方..

HTML

<div class="slider"> 
     <a href="https://google.com"><img id="1" src="bilder/partner.jpg" type="jpg/png"> 
     <a href="https://msn.com"><img id="2" src="bilder/värmeplatta.jpg" type="jpg/png"> 
     <a href="https://twitter.com"><img id="3" src="bilder/Img3.jpg" type="jpg/png"> 
    </div>

CSS

.slider 
     { 
      width:600px; 
      height:300px; 
      overflow:hidden; 
      margin: auto; 
      background-color:white; 
      background-image:url(LoadingLogo.gif); 
      background-size:50px 50px; 
      background-position:center; 
      background-repeat:no-repeat; 
      border:2px solid; 
     } 
     .slider img 
     { 
      width:600px; 
      height:300px; 
      display:none; 
     }

的Javascript

function Slider() 
       { 
        $("#1").show("slide",{direction:'right'},800); 
        $("#1").delay(4500).hide("slide",{direction:'left'},800); 

        var sc=$(".slider img").size(); 
        var count=2; 

        setInterval(function() 
        { 
         $("#"+count).show("slide",{direction:'right'},800); 
         $("#"+count).delay(4500).hide("slide",{direction:'left'},800); 

         if(count==sc) 
          count=1; 
         else 
          count=count+1; 
        },6100) 
       }

删除.delay（4500）部分 – guramidev

的.delay（4500）是什么使图像停留4.5 secounds 。删除图像中只有保留的内容，然后再次直接滑入。 –

检查答案 – guramidev

答

我不能创建一个小提琴，但尝试使用此代码，而不是提供：

function Slider() { 

$("#1").show("slide",{direction:'right'},800); 

var slideCount = $('.slider').find('img').length, 
    prevSlide = 1, 
    activeSlide = 2; 

    setInterval(function() { 

     $('#' + prevSlide).hide('slide',{direction:'left'},800); 

     $('#' + activeSlide).show('slide',{direction:'right'},800); 

     activeSlide++; 
     prevSlide = activeSlide - 1; 

     if(activeSlide === slideCount) 
      activeSlide = 1; 

     if(prevSlide === 0) 
      prevSlide = slideCount; 

    },6100) 
}

幻灯片放映幻灯片，其他幻灯片放映幻灯片

相关推荐