<!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>