Acettest's Blogs

Think Different

jQuery hide() speed和callback参数基本使用
<!DOCTYPE html>
<html>
<head>
	<title></title>
	<script src="jquery-3.3.1.min.js"></script>
	<script type="text/javascript" src="mshengjq.js"></script>
	<style type="text/css">
		body,div{
			margin: 0px;
			padding: 0px;
		}
		#left{
			background-color: red;
			height: 300px;
			width: 200px;
			float: left;
		}
		#middle{
			background-color: gold;
			width: 400px;
			height: 300px;
			float: left;
		}
		#right{
			background-color: green;
			height: 400px;
			width: 200px;
			/*margin: 0 auto;*/
			float: right;
		}
		#footer{
			background-color: blue;
			height: 20px;
			width: 800px;
			clear: both;
			margin: 0 auto;
		}
		#both{
			width: 800px;
			/*height: 600px;*/
			margin: 0 auto;
			/*clear: both;*/
			background-color: pink;
		}
		#head{
			background-color: yellow;
			height: 100px;
			width: 800px;
			margin: 0 auto;
		}
		#empty{
			clear: both;
		}		
	</style>
	<script>
		$(document).ready(function() {
			$("div").click(function(){
				//alert(this.id);
				// if(this.id=="head"){
				// 	$(this).css("background-color","red");
				// }
				// else{
					$(this).hide(2000,ShowDiv);//函数名不加双引号以及括号
				// }
			});
		});

		function ShowDiv(){
			var x = $("#head").show(2000);//此处可以使用jQuery css选择器
			$(this).css("background-color","red");
		}
		function GetDivs(){
			var x=document.getElementsByTagName("div");
			alert(x.length);
			var idnames="";
			for(var item in x){	
				var idname=x[item].id;			
				idnames=idname +" ";
			}
			alert(idnames);
		}
	</script>
</head>
<body>
	<div id="head">		
	</div>
	<div id="both">
		<div id="left">
		</div>
		<div id="right">
		</div>
		<div id="middle">
		</div>
		<div id="empty">
		</div>
	</div>

	<div id="footer">
	</div>
</body>
</html>

阅读更多
个人分类: jQuery
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

不良信息举报

jQuery hide() speed和callback参数基本使用

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭