我是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/
答案 0 :(得分:1)
万一有人碰到这个,这是正确的代码:
HTML:
from
JS:
<!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>
上的解决方案
感谢@Jonathan Michalik的评论