码迷,mamicode.com
首页 > Web开发 > 详细

jQuery访问属性,绝对定位

时间:2015-06-10 22:38:07      阅读:187      评论:0      收藏:0      [点我收藏+]

标签:

一. jQuery访问属性

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>jQuery attr demo</title>
</head>
<body>
	<input id="check" type="checkbox" checked="checked">
	<label for="check">复选框</label>
	<p></p>
</body>
<script type="text/javascript" src="jquery-2.1.1.min.js"></script>
<script type="text/javascript">
	$(function(){
		$("input").change(function(){
			var $input = $(this);
			$("p").html(".attr('checked') = <b>" + $input.attr('checked') + "</b><br>"
				 	  + ".prop('checked') = <b>" + $input.prop('checked') + "</b><br>"
				  	  + ".is(':checked') = <b>" + $input.is(':checked') );
		}).change();
	})
</script>
<style>
b {color: red;}
</style>
</html>

二. jQuery绝对定位

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>jQuery absolute fix demo</title>
</head>
<body>
	<div>盒子1</div>
	<div style="float:left">盒子2</div>
	<div style="float:left">盒子3</div>
</body>
<script type="text/javascript" src="jquery-2.1.1.min.js"></script>
<script type="text/javascript" >
	$(function(){
    	var o1 = $("div").eq(0).offset();					//获取第一个div元素的偏移信息
    	$("div").eq(0).html( "left: " + o1.left + "<br />top: " + o1.top ); 	//显示信息
    	var o2 = $("div").eq(1).offset();					//获取第二个div元素的偏移信息
    	$("div").eq(1).html( "left: " + o2.left + "<br />top: " + o2.top ); 	//显示信息
    	var o3 = $("div").eq(2).offset();					//获取第三个div元素的偏移信息
    	$("div").eq(2).html( "left: " + o3.left + "<br />top: " + o3.top ); 	//显示信息
	})
</script>

<style type="text/css">
	body { padding:0; margin:0; }/*清除页边距*/
	div {height:60px; width:200px; border:solid 10px red; }/*统一div元素的显示样式*/ 
</style>
</html>





jQuery访问属性,绝对定位

标签:

原文地址:http://blog.csdn.net/u012769750/article/details/46446083

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!