滑動面板 - jQuery

我對jQuery相當陌生，我正在試驗一個'面板'，它被假設爲單擊時滑動，儘管我很難理解'面板'爲什麼點擊時不滑動。任何人都可以啓發我關於這個話題嗎？一般來說，我也對任何其他有關我的代碼的建議持開放態度。滑動面板 - jQuery

HTML：

<!DOCTYPE html> 
<html> 
<head> 
    <title>Slide Panel</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> 
    <script type="text/javascript" src="script.js"></script> 
    <link rel="stylesheet" type="text/css" href="stylesheet.css"></link> 
</head> 
<body> 
    <div class="panel"> 
    <br /> 
    <br /> 
    <p>Now you see me!</p> 
    </div> 
    <p class="slide"><div class="pull-me">Slide Up/Down</div></p> 
</body> 
</html>

JS（編輯固定）：

$(document).ready(function() { 
$('.pull-me').click(function() { 
    $('.panel').slideToggle('slow'); 
    }); 
})

正確的解決辦法：http://jsfiddle.net/3kt10v3b/

~~的jsfiddle：http://jsfiddle.net/3kt10v3b/~~

來源

2015-07-05 UrbanCohort

我想你只需扳動-flopped a）和a}。切換）}的順序;在'$（'。panel'）。'slideToggle（'slow'）;'to}）; –

哇......那樣做，謝謝！ – UrbanCohort

萬一有人遇到這個，在這裏S上的正確代碼：

HTML：

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Slide Panel</title>    
     <link rel="stylesheet" type="text/css" href="stylesheet.css"></link> 
    </head> 
    <body> 
     <div class="panel"> 
      <br/><br/> 
      <p>Now you see me!</p> 
     </div> 

     <p class="slide"><div class="pull-me">Slide Up/Down</div></p> 

     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> 
     <script type="text/javascript" src="script.js"></script> 
    </body> 
</html>

JS：

$(document).ready(function() { 
    $('.pull-me').click(function() { 
     $('.panel').slideToggle('slow'); 
    }); 
})

解決方案上Fiddle

由於@Jonathan米哈利克的評論

來源

2018-01-10 16:59:29 UrbanCohort

滑動面板 - jQuery

回答

相關問題