gpt4 book ai didi

javascript - 我怎样才能得到相对定位的 parent

转载 作者:行者123 更新时间:2023-11-28 14:47:21 26 4
gpt4 key购买 nike

假设我有类似的东西

<body>
<article style="left: xxx; top: xxx">...</article>
<article style="left: xxx; top: xxx">...</article>
<article style="left: xxx; top: xxx">...</article>
</body>

我的目标是找到哪个“扇区”中的元素,例如。顶部/底部左/右。然后添加样式类。所以我想我会的

  1. 找到相对定位的父级
  2. 获取它的宽度和高度并从那里计算文章/元素的位置

我知道我的文章是相对于正文定位的,但我如何使用 JS/jQuery 动态地获取它。我正在创建一个插件,所以我不想对相对定位的父对象进行硬编码。

最佳答案

Alex Thomas 关于正确使用 javascript 以快速加载和优雅降级的方式增强用户体验的观点是绝对正确的。

无论如何,这里有一个 jsfiddle 的快速概念证明,它可以执行您所描述的内容:

Quadrant Based Classes

来源(粗略):

var $articles = $("article");
$articles.each(function(){
var $which = $(this);
var $parent = $which.parent();
var className = "";

var pHeight =$parent.outerHeight();
//alert($which.offset().top + " <> " + (pHeight/2));
if($which.offset().top < (pHeight/2)){
className += "Bottom";
} else {
className += "Top";
}

var pWidth =$parent.outerWidth();
//alert($which.offset().left + " <> " + (pWidth /2));
if($which.offset().left < (pWidth/2)){
className +="Left";
} else {
className +="Right";
}
$which.addClass(className);
});

关于javascript - 我怎样才能得到相对定位的 parent ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5137740/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com