jQuery:偏移问题

发布于 2024-09-26 07:43:20 字数 980 浏览 4 评论 0原文

我有一个奇怪的 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 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

月依秋水 2024-10-03 07:43:20

如果浏览器对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.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文