我怎样才能让一个图像滑块，停在最后的图像，并用重放按钮

我怎样才能使图像滑块，使用HTML CSS JS只我怎样才能让一个图像滑块，停在最后的图像，并用重放按钮

$("#slideshow > div:gt(0)").hide(); 
 
setInterval(function() { 
 
    $('#slideshow > div:first') 
 
     .fadeOut(1000) 
 
     .next() 
 
     .fadeIn(1000) 
 
     .end() 
 
     .appendTo('#slideshow'); 
 
    currentPosition++; 
 
}, 3000);

#slideshow { 
 
    text-align: center; 
 
    position: relative; 
 
} 
 
#slideshow > div { 
 
    position: absolute; 
 
    top: 10px; 
 
    left: 10px; 
 
    right: 10px; 
 
    bottom: 10px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="slideshow"> 
 
      <div> 
 
       <img src="" alt=""> 
 
      </div> 
 
      <div> 
 
       <img src="" alt=""> 
 
      </div> 
 
      <div> 
 
       <img src="" alt=""> 
 
      </div> 
 
     </div>

最后的图像，并在最后的影像重放按钮停止

我需要在最后的影像停止滑块和需要重放按钮吧。

来源

2016-09-22 Sonali

我没有得到任何解决方案@RasmusGlenvig – Sonali

以上是我的滑代码 – Sonali

是的，我可以看到:)但你试过用你自己来解决问题，就像你到目前为止所做的一样，以达到你想要的。 – RasmusGlenvig

var currentPosition = 0; 
Play();  

function getCurrentImage(){ 
    var currentImage = $('#slideshow > div')[currentPosition]; 
    changeImage(currentImage); 
} 

function changeImage(currentImage){ 

    if(currentPosition != $("#slideshow > div").length + 1){ 

    setTimeout(function(){ 

     if(currentPosition == $("#slideshow > div").length - 1){ 
      $("#slideshow").append('<a href="#" onclick="Play();" style="margin-left:15px;">Replay</a>').fadeIn(1000); 
      return; 
     } 

     $(currentImage).fadeOut(1000) 
     .next() 
     .fadeIn(1000); 

     currentPosition++; 
     getCurrentImage(); 

    },2000); 
    } 
} 

function Play(){ 
    currentPosition = 0; 
    $("#slideshow > div:gt(0)").hide(); 
    getCurrentImage(); 
}

来源

2016-09-22 09:18:25 RahulPurohit

但重启需要一段时间才能加载 – Sonali

试试这个@Sonali ...！ – RahulPurohit

它仍然需要时间。 – Sonali

试试这个。

function play() { 
    $("#slideshow > div").hide(); 
    $('#slideshow > div:first').fadeIn(1000, function() { 
    $(this).fadeOut(1000, function() { 
     $(this).next().fadeIn(1000, function() { 
     $(this).fadeOut(1000, function() { 
      $(this).next().fadeIn(1000); 
     }) 
     }) 
    }) 
    }) 

} 
$("#replay").on("click", function() { 
    play(); 
}) 

play();

工作小提琴这里 - >https://jsfiddle.net/sherin81/Lu913v34/

来源

2016-09-22 09:35:42

我怎样才能让一个图像滑块，停在最后的图像，并用重放按钮

回答

相关问题