jQuery slideDown() 方法用于向下滑动元素。

语法

$(selector).slideDown(speed);
$(selector).slideDown(speed, callback); 
$(selector).slideDown(speed, easing, callback);

参数

  • speed:指定元素向下滑动的速度。它可能的值是slow、normal、fast和毫秒。
  • easing:可选参数指定用于过渡的缓动函数。linear表示匀速移动,swing表示在开头/结尾移动慢,在中间移动快
  • callback:可选参数。指定slideDown()效果完成后调用的函数。

例子

<!DOCTYPE html>
<html>
	<title>jQuery slideDown() 方法 -yxjc123.ocm</title>
<head>
<script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
<script> 
$(document).ready(function(){
    $("#flip").click(function(){
        $("#panel").slideDown("slow");
    });
});
</script>
 <style> 
#panel, #flip {
    text-align: center;
    background-color: orange;
    border: solid 1px #c3c3c3;
	width:240px;
	font-size:14px;
}
#panel {
    padding: 20px 0px;
    display: none;
}
</style>
</head>
<body>
<div id="flip">点击向下滑动面板</div>
<div id="panel"> yxjc123.com,
介绍jquery的常用方法。</div>
</body>

</html>
效果如下:

jQuery slideDown() 方法