jQuery:偏移问题
我有一个奇怪的 jQuery.offset() 问题。
组件被分层并剥夺了下面链接的功能。上层是透明的、空的。
我的解决方案是迭代所有链接(所有 a
元素),获取它们的位置(顶部、左侧、高度和宽度值)和 href,并创建一个新的 a
元素在同一位置,放置在上层。
问题:此方法适用于四个链接中的三个。在一种情况下,新元素的位置距顶部约 120 像素,但尺寸和向左偏移都很好。对最后一项有什么想法吗?
$("#container A").each(function(index){
var top = $(this).offset().top;
var left = $(this).offset().left;
var width = $(this).width();
var height = $(this).height();
var href = $(this).attr("href");
$('<A id="layer'+index+'"></A>').addClass("overlayer").css("left", left).css("top", top).css("width", width).attr("href", href).css("height", height).appendTo('#toplayer');
}
注意:#container
是包含所有链接的下层,#toplayer
是上层。
.overlayer 的 CSS 类:
.overlayer {
background-color: #cc00cc;
position: absolute;
z-index: 10;
cursor: hand;
}
I have a strange jQuery.offset() problem.
Components are being layered and taking away the functionality of the links underneath. The upper layer is transparent and empty.
My solution is to iterate over all links (all a
elements), grab their location (top, left, height and width values) and href, and create a new a
element at the same position, placed in the upper layer.
Problem: this method works for three out of four links. In one case, the new element is located about 120px off to the top, but the size and offset to the left are fine. Any ideas on the last one?
$("#container A").each(function(index){
var top = $(this).offset().top;
var left = $(this).offset().left;
var width = $(this).width();
var height = $(this).height();
var href = $(this).attr("href");
$('<A id="layer'+index+'"></A>').addClass("overlayer").css("left", left).css("top", top).css("width", width).attr("href", href).css("height", height).appendTo('#toplayer');
}
Note: #container
is the lower layer with all links, #toplayer
is the the upper layer.
The CSS class for .overlayer:
.overlayer {
background-color: #cc00cc;
position: absolute;
z-index: 10;
cursor: hand;
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
如果浏览器对
pointer-events: none
的支持足以满足你可以用它来代替 JS hacks 作为你的上层覆盖层。一些不支持它的较旧的 IE 有一个“功能”,您可以在没有背景的情况下单击框,您也许可以使用它。
If browser support for
pointer-events: none
is good enough for you, you could use that for your upper covering layer instead of JS hacks.Some older IEs that don't support it have a "feature" that you can click through boxes without a background that you maybe could use.