JavaScript show()方法和 hide();
通过jQuery，你可以使用show()和hide()方法来显示和隐藏HTML元素
实例：
</script>
<script>
$(document).ready(function(){
$("#hide").click(function(){
$("p").hide();
});
$("#show").click(function(){
$("p").show();
});
});
</script>
</head>
<body>
<button id="hide">隐藏</button>
<button id="show">显示</button>
<p>如果你点击“隐藏” 按钮，我将会消失。</p>
语法：jQuery 对象.hide(duration,[fn]);
其中，参数duration表示效果运行时间。例如，使div在0.6秒内发生逐渐显示的动画效果；
$("div").show(600);
淡入淡出动画效果
jQuery fadln() 用于已隐藏的元素
语法 ：jQuery对象.fadeIn(duration,[fn])；
参数的功能和show()、hide()相同;
实例：
<script>
$(function(){
$("button").click(function(){
$("#div1").fadeIn();
$("#div2").fadeIn(1000);
$("#div3").fadeIn(3000);
});
});
</script>
<p>以下实例演示了 fadeIn() 使用了不同参数的效果。</p>
<button>点击淡入 div 元素。</button>
<br><br>
<div id="div1" style="width:80px;height:80px;display:none;background-color:red;"></div><br>
<div id="div2" style="width:80px;height:80px;display:none;background-color:green;"></div><br>
<div id="div3" style="width:80px;height:80px;display:none;background-color:blue;"></div>
jQuery fadeOut() 方法
jQuery fadeOut() 方法用于淡出可见元素。
语法：jQuery对象.fadeOut(fadeIn(duration,[fn])
实例：
<script>
$(function(){
$("button").click(function(){
$("#div1").fadeOut();
$("#div2").fadeOut(1000);
$("#div3").fadeOut(3000);
});
});
</script>
<p>以下实例演示了 fadeOut() 使用了不同参数的效果。</p>
<button>点击淡出 div 元素。</button>
<br><br>
<div id="div1" style="width:80px;height:80px;background-color:red;"></div><br>
<div id="div2" style="width:80px;height:80px;background-color:green;"></div><br>
<div id="div3" style="width:80px;height:80px;background-color:blue;"></div>
jQuery fadeToggle() 方法
jQuery fadeToggle() 方法可以在 fadeIn() 与 fadeOut() 方法之间进行切换。
如果元素已淡出，则 fadeToggle() 会向元素添加淡入效果。
如果元素已淡入，则 fadeToggle() 会向元素添加淡出效果。
语法:jQuery对象.fadeToggle(fadeIn(duration,[fn]);
实例：
<script>
$(function(){
$("button").click(function(){
$("#div1").fadeToggle();
$("#div2").fadeToggle(1000);
$("#div3").fadeToggle(3000);
});
});
</script>
<p>使用fadeToggle()淡入淡出元素</p>
<button>点击淡入/淡出 div 元素。</button>
<br><br>
<div id="div1" style="width:80px;height:80px;background-color:red;"></div><br>
<div id="div2" style="width:80px;height:80px;background-color:green;"></div><br>
<div id="div3" style="width:80px;height:80px;background-color:blue;"></div>
