您的位置:首页 > Web前端 > JQuery

JQuery效果

2016-07-22 14:58 609 查看
<!DOCTYPE html>
<html>

<head>
<metacharset="UTF-8">
<title></title>
<styletype="text/css">
div{
width:100px;
height:100px;
background-color: springgreen;
margin-top:20px;
}
</style>
<scriptsrc="js/jq/jquery-2.1.3.min.js"type="text/javascript"
charset="utf-8"></script>
<scripttype="text/javascript">
$(document).ready(function() {
$("#btn1").click(function() {
$("#div1").hide(1000);
})
$("#btn2").click(function() {
$("#div1").show(1000);
})
$("#btn3").click(function() {
$("#div1").toggle(1000);
})
})
</script>
</head>

<body>
<inputtype="button"
name="btn" id="btn1"value="hide"
/>
<inputtype="button"
name="btn" id="btn2"value="show"
/>
<inputtype="button"
name="btn" id="btn3"value="toggle"
/>
<div
id="div1"></div>
</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  jQuey