JQuery块元素

似乎无法使此代码正常工作：

我想做的只是覆盖。。。覆盖到名为“footer”的DIV区域，但它似乎根本不这样做

JS代码：

$('#enableOverlay').live('click',function(event){
    var $overlay = $('<div id="overlay"><div id="overlayText"><img src="/img/sendingData.gif"><p class="overlaytxt1">Your data is being saved</p><p class="overlaytxt2">Please wait...</p></div></div>').prependTo('#footer');
    var $footer = $('#footer');
    var $enable = $('#enableOverlay');

    $enable.addClass('active');
    $overlay.fadeIn();
});

​

---

可能是什么问题？

绝对定位的元素相对于最近定位的父元素进行定位，在您的情况下，父元素就是文档

要解决您的问题，您需要定位footer元素，这将导致

#overlay

的

top:0

，

left:0

引用

#footer

的左上角

#footer{
    position:relative;
}

---

我已经准备好了，这样你们就可以看到它的实际应用。

如果我们从上一个问题中提取一些代码，从这个问题中提取一些代码，我们就会得到这个。 我们使用纯js设置了大小，这次还设置了覆盖的位置。这需要一个新功能：

function findPos(obj) {
    var curleft = curtop = 0;
    if(obj.offsetParent){
        do {
            curleft += obj.offsetLeft;
            curtop += obj.offsetTop;
        } while (obj = obj.offsetParent);
    }
    return [curleft,curtop];
}

​ 我们用它来计算页脚在哪里。小提琴很短，可能是不言自明的。如果没有发表评论，我会提供更多细节

注: 这样做意味着，无论您如何放置和/或调整页脚大小，覆盖层都将跟随它。此外，这将在所有主要浏览器上正常工作

编辑：

---

下面是一个从js添加的示例，就像您在评论中要求的那样。

有趣的CSS。我想你又贴上了你的JS你能给我一个版本，在JavaScript中有覆盖html，就像我的例子一样吗？似乎在现场创建覆盖div比在代码中创建覆盖div更有效。@StealthRT添加了更新fiddle的链接。如果覆盖的内容是动态生成的，那么这种方法将非常有用。但是，如果覆盖的内容是静态的，那么第一种方法更好。是否可以使用JQuery而不是getElementById、getComputedStyle、style.top等编写JS？它仍然不能在IE中正常工作。@StealthRT您使用的是哪个IE版本？IE9，但开尔文的代码可以工作。只是想要你的，因为它有职位的东西。

#footer{
    position:relative;
}

function findPos(obj) {
    var curleft = curtop = 0;
    if(obj.offsetParent){
        do {
            curleft += obj.offsetLeft;
            curtop += obj.offsetTop;
        } while (obj = obj.offsetParent);
    }
    return [curleft,curtop];
}