1 $("#03").click(function() 2 { 3 $("#03").show(speed); 4 $("#03").css("cursor","pointer"); 5 $(".tableBorder4").toggle(1000); 6 }) 7 8 9 10 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 11 <html xmlns="http://www.w3.org/1999/xhtml"> 12 <head> 13 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 14 <title>無標題文檔</title> 15 <script src="http://ybin.cn/js/jq.min.js" type="text/javascript"></script> 16 <script type="text/javascript"> 17 $(document).ready( function(){}); 18 function hiden(){ 19 $("#divObj").hide();//hide()函數,實現隱藏,括號里還可以帶一個時間參數(毫秒)例如hide(2000)以2000毫秒的速度隱藏,還可以帶slow,fast 20 } 21 function slideToggle(){ 22 $("#divObj").slideToggle(2000);//窗簾效果的切換,點一下收,點一下開,參數可以無,參數說明同上 23 } 24 function show(){ 25 $("#divObj").show();//顯示,參數說明同上 26 } 27 function toggle(){ 28 $("#divObj").toggle(2000);//顯示隱藏切換,參數可以無,參數說明同上 29 30 } 31 function slide(){ 32 $("#divObj").slideDown();//窗簾效果展開 33 } 34 </script> 35 </head> 36 37 <body> 38 <h3>div里內容的顯示隱藏特效</h3> 39 <input type="button" value="隱藏" onclick="hiden()"/> 40 <input type="button" value="顯示" onclick="show()"/> 41 <input type="button" value="窗簾效果顯示2" onclick="slide()"/> 42 <input type="button" value="窗簾效果的切換" onclick="slideToggle()"/> 43 <input type="button" value="隱藏顯示效果切換" onclick="toggle()"/> 44 <div id="divObj" style="display:none"> 45 1.測試例子<br/> 46 2.測試例子<br/> 47 3.測試例子<br/> 48 4.測試例子<br/> 49 5.測試例子<br/> 50 6.測試例子<br/> 51 7.測試例子<br/> 52 8.測試例子<br/> 53 9.測試例子<br/> 54 0.測試例子<br/> 55 </div> 56 </body> 57 </html> 58 59
$("#03").click(function() { $("#03").show(speed); $("#03").css("cursor","pointer"); $(".tableBorder4").toggle(1000); })
無標題文檔
div里內容的顯示隱藏特效