.hide([duration][,complete])——目标元素的隐藏;
.show([duration][,complete])——目标元素的显示;
.toggle([duration][,complete])——当目标元素隐藏时则显示,否则隐藏;
注:可选参数[duration]为方法执行的时间区间;[,complete]为回调函数。
<!DOCTYPE html>
<html lang="zh_CN">
<head>
<meta charset="UTF-8">
<title>显示与隐藏</title>
<script src="js/jquery-2.1.3.min.js"></script>
<script src="js/my.js"></script>
<style>
div{
background: #005599;
width: 100px;
height: 100px;
margin: 5px;
float: left;
}
</style>
</head>
<body>
<img src="images/g.jpg"/>
<button id="btn1">隐藏</button>
<button id="btn2">显示</button>
<button id="btn3">隐藏/显示</button>
</body>
</html>
/*显示与隐藏*/
$(document).ready(function(){
//隐藏
$('#btn1').click(function(){
//$('img').hide();
$('img').hide(1000);
});
//显示
$('#btn2').click(function(){
//$('img').show();
$('img').show(1000);
});
//切换显示与隐藏
$('#btn3').click(function(){
//$('img').toggle();
$('img').toggle(1000);
});
//利用hide()制作一个效果
for(var i=0;i<5;i++){
$("<div>").appendTo(document.body);
}
$('div').click(function(){
$(this).hide(2000,function(){
$(this).remove();
})
})
})