jq控制移入移除，你要的全在這裡
<!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>jQuery事件-div的顯示隱藏及滑鼠的移入移出</title>
<style>
.header{
width:302px;
height:40px;
background:green;
font-size:20px;
margin-bottom: 0px;
}
.content{
width:300px;
border:1px solid #333;
background:#CCC;
display: none;
margin-top:0px;
}
</style>
</head>
<script type="text/javascript" src="jquery-1.11.1.js"></script>
<script type="text/javascript">
$(function (){
//顯示隱藏
$(".header").click(function (){
var flag = $(".content").is(":hidden");
if(flag){
$(".content").show();
}else{
$(".content").hide();
}
});
/*
//使用bind的繫結事件,跟上上面的效果是一樣的
$(".header").bind("click", function (){
var flag = $(".content").is(":hidden");
if(flag){
$(".content").show();
}else{
$(".content").hide();
}
});
*/
/*
//滑鼠的移入移出
$(".header").mouseover(function (){
$(".content").show();
}).mouseout(function (){
$(".content").hide();
});
*/
/*
//合成事件 hover()
$(".header").hover(function (){
$(".content").show();
},function (){
$(".content").hide();
});
*/
});
</script>
<body>
<h5 class="header" align="center">什麼是jQuery？</h5>
<div class="content">
Jquery是繼prototype之後又一個優秀的Javascript庫。它是輕量級的js庫 ，
它相容CSS3，還相容各種瀏覽器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+），
jQuery2.0及後續版本將不再支援IE6/7/8瀏覽器。
jQuery使使用者能更方便地處理HTML（標準通用標記語言下的一個應用）、events、實現動畫效果，
並且方便地為網站提供AJAX互動。jQuery還有一個比較大的優勢是，它的文件說明很全，
而且各種應用也說得很詳細，同時還有許多成熟的外掛可供選擇。
jQuery能夠使使用者的html頁面保持程式碼和html內容分離，也就是說，
不用再在html裡面插入一堆js來呼叫命令了，只需要定義id即可。
</div>
</body>
</html>