幻燈片溢出，而滑動和向下滑動繼續使用

大家好我在這裏試圖做一個滑塊效果點擊按鈕，點擊按鈕的詳細信息有關該部分出現在特定的div現在正在運行，但我面臨這是一個錯誤，如果我點擊快速，就像我點擊slide1和之後slide2然後另一張幻燈片溢出從該代碼看起來像代碼打破嚴重。請幫助我，或讓我知道我缺少的東西。我已經提供了那部分代碼，形成了我的jsp頁面。幻燈片溢出，而滑動和向下滑動繼續使用

<html> 
<head> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
<style> 
.sp { 
     background-color:white; 
    width:788px; 
    height:500px; 
    float:left; 
    text-align:center; 
    font-size:100%; 
    display:none; 
} 

</style> 

</head> 
<body> 
<div> 
<div style="width:200px;height:500px;background-color:#E6E6E6;text-align:center;float:left;"> 
               <a class="last_item" id="slide1">slide1</a><br> 
               <a class="last_item" id="slide2">slide2</a><br> 

               </div> 
         <div id="target1" class="sp"> 
               slide1 details 
               </div> 
               <div id="target2" class="sp"> 
               slide2 details 

               </div> 

</div> 


<script type="text/javascript"> 
     jQuery(document).ready(function(){ 

      jQuery('#slide1').click(function(){ 

       jQuery('.sp').slideUp(); 
       jQuery('#target1').slideDown(); 
      }) ; 

       jQuery('#slide2').click(function(){ 

       jQuery('.sp').slideUp(); 
       jQuery('#target2').slideDown(); 
      }) ; 



     }); 


</script> 

</body> 
</html>

來源

2013-09-24 b22

嘗試增加.stop（）■防止動畫疊加，如：（可能需要修改）

jQuery('#slide1').click(function(){ 

      jQuery('.sp').stop(true, true).slideUp(); 
      jQuery('#target1').stop(true, true).slideDown(); 
     }) ; 

      jQuery('#slide2').click(function(){ 

      jQuery('.sp').stop(true, true).slideUp(); 
      jQuery('#target2').stop(true, true).slideDown(); 
     }) ;

來源

2013-09-24 17:25:29

@HC：非常感謝你。它解決了我的問題。 – b22

好聽，沒問題。如果您不介意您是否可以點擊我評論中的數字下方的複選標記以將其標記爲正確？ –

我會這樣做，我試圖這樣做，但它要求我等待幾分鐘。 – b22

幻燈片溢出，而滑動和向下滑動繼續使用

回答

相關問題