jquery效果

来源：互联网发布：学cnc编程多少学费编辑：程序博客网时间：2024/06/09 19:28

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title here</title><style type="text/css">div{border:1px solid #000;width:100px;height:100px;}</style><!-- 导入js库 ，注意：使用src属性之后，标签体中不能写入内容--><script type="text/javascript" src="../js/jquery-1.8.3.js"></script><script type="text/javascript">$(document).ready(function(){$("#b1").click(function(){$("#b1Div").toggle("1000");});$("#b2").click(function(){$("#b2Div").slideToggle("slow");});$("#b3").click(function(){$("#b3Div").fadeToggle("slow");});});</script></head><body><input type="button" id="b1" value="显示/隐藏 b1Div" /><div id="b1Div"></div> <br/><input type="button" id="b2" value="滑出/滑入b2Div"/><div id="b2Div"></div> <br/><input type="button" id="b3" value="淡出/淡入b3Div" /><div id="b3Div"></div></body></html>

0 0