1. 首頁
  2. 問答
  3. SlideUp只有在SlideUp結束後

SlideUp只有在SlideUp結束後

2017-01-05 37 views
0

我有以下代碼。 我正在嘗試SlideDown div2，但只有在div1已結束到SlideUp後，我該怎麼做？SlideUp只有在SlideUp結束後

<!DOCTYPE html> 
<html> 
    <body> 
     <h1>slideDown()</h1> 
     <input type="button" id="btn" value="slideDown"> 
     <div id="d1" style="background:red;width:100px;height:100px">This is the Div</div> 
     <div id="d2" style="background:blue;width:100px;height:100px;display:none">This is the Div</div> 
     <script src="js/jquery-2.2.0.min.js"></script> 
     <script> 
      $(document).ready(function() 
      { 
       $("#btn").click(function() 
       { 
        $("#d1").slideUp(2000); 
        $("#d2").hide();          
        // do it only after slideup has ended          
        $("#d1").hide(); 
        $("#d2").slideDown(2000); 
       }); 
      }); 
     </script> 
    </body> 
</html>

來源

2017-01-05 ehh

回答

2

改變你的腳本標籤

 <script> 
    $(document).ready(function() 
{ 

     $("#btn").click(function() 
     { 
     $("#d1").slideUp(2000,function(){ 
       $("#d1").hide(); 
       $("#d2").slideDown(2000); 
     });      
     }); 

    }); 
    </script>

對效果基本show &更多的參考了slideDown事件是指this

來源

2017-01-05 12:43:25 SoftwareNerd

4

您可以回撥slideUp。 

$("#d1").slideUp(2000, function(){ $("#d2").slideDown(2000); });

這裏一個Fiddle

來源

2017-01-05 12:30:20 Roy

+0

見http://api.jquery.com/slideup /獲取更多信息。 –

相關問題

 相關問題