javascript

位置:IT落伍者 >> javascript >> 浏览文章

jquery简单的div显示和隐藏特效


发布日期:2018年03月26日
 
jquery简单的div显示和隐藏特效

<!DOCTYPE html PUBLIC "//WC//DTD XHTML Transitional//EN" "://wwwworg//xhtml"> <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>

上一篇:js控制表单奇偶行样式

下一篇:js 得到文件后缀(通过正则实现)