手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jQuery中offsetParent()方法用法实例
jQuery中offsetParent()方法用法实例
摘要:本文实例讲述了jQuery中offsetParent()方法用法。分享给大家供大家参考。具体分析如下:此方法可以返回匹配元素所有祖先元素中第...

本文实例讲述了jQuery中offsetParent()方法用法。分享给大家供大家参考。具体分析如下:

此方法可以返回匹配元素所有祖先元素中第一个采用定位的祖先元素。

所谓采用定位的父元素就是施加position:relative或者position:absolute(fixed)的元素。

此方法仅对可见元素有效。

语法结构:

复制代码 代码如下:$(selector).offsetParent()

代码实例:

复制代码 代码如下:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="http://www.jb51.net/" />

<title>offsetParent()函数-查字典教程网</title>

<style type="text/css">

.grandfather

{

width:200px;

height:200px;

background-color:red;

position:relative;

}

.father

{

width:150px;

height:150px;

background-color:blue;

}

.children

{

width:50px;

height:50px;

background-color:green;

}

</style>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript">

$(document).ready(function(){

$("button").click(function(){

$(".children").offsetParent().css("backgroundColor","yellow");

})

})

</script>

</head>

<body>

<div>

<div>

<div></div>

</div>

</div>

<button>查看效果</button>

</body>

</html>

以上代码可以将children元素中所有祖先元素中,第一个采用定位的祖先元素的背景颜色设置为红色。

希望本文所述对大家的jQuery程序设计有所帮助。

本文转自:蚂蚁部落http://www.softwhy.com/

【jQuery中offsetParent()方法用法实例】相关文章:

简介JavaScript中toUpperCase()方法的使用

详解JavaScript中setSeconds()方法的使用

JavaScript中的setUTCDate()方法使用详解

JQuery中属性过滤选择器用法

JavaScript中的replace()方法使用详解

javaScript中with函数用法实例分析

jQuery插件制作之全局函数用法实例

JQuery中Text方法用法实例分析

简介JavaScript中toTimeString()方法的使用

JavaScript中用getDate()方法返回指定日期的教程

精品推荐
分类导航