jquery之超簡單的div顯示和隱藏特效demo

本篇文章是對jquery中的div顯示和隱藏特效demo進行了詳細的分析介紹需要的朋友可以參考下復制代碼代碼如下:

　　
<!DOCTYPE html PUBLIC "//WC//DTD XHTML Transitional//EN" "
<html xmlns="
<head>
<meta httpequiv="ContentType" content="text/html; charset=utf" />
<title>無標題文檔</title>
<script src="jquery_lastjs" type="text/javascript"></script>
<script type="text/javascript">
$(document)ready( function(){});
function hiden(){
$("#divObj")hide();//hide()函數實現隱藏括號裡還可以帶一個時間參數(毫秒)例如hide()以毫秒的速度隱藏還可以帶slowfast
}
function slideToggle(){
$("#divObj")slideToggle();//窗簾效果的切換點一下收點一下開參數可以無參數說明同上
}
function show(){
$("#divObj")show();//顯示參數說明同上
}
function toggle(){
$("#divObj")toggle();//顯示隱藏切換參數可以無參數說明同上
}
function slide(){
$("#divObj")slideDown();//窗簾效果展開
}
</script>
</head>
<body>
<h>div裡內容的顯示隱藏特效</h>
<input type="button" value="隱藏" onclick="hiden()"/>
<input type="button" value="顯示" onclick="show()"/>
<input type="button" value="窗簾效果顯示" onclick="slide()"/>
<input type="button" value="窗簾效果的切換" onclick="slideToggle()"/>
<input type="button" value="隱藏顯示效果切換" onclick="toggle()"/>
<div id="divObj" style="display:none">
        測試例子<br/>
        測試例子<br/>
        測試例子<br/>
        測試例子<br/>
        測試例子<br/>
        測試例子<br/>
        測試例子<br/>
        測試例子<br/>
        測試例子<br/>
        測試例子<br/>
    </div>
</body>
</html>

From:http://tw.wingwit.com/Article/program/Java/JSP/201311/20055.html