Question

我正在尝试获取浏览器的宽度和高度，并使用jQuery将两个不同的DIV附加到两个不同的位置。

DIV ONE应该是绝对定位的，左边40px，浏览器窗口底部40px，而DIV TWO应该是右边40px，底部40px，无论设备在什么设备上看（所以必须在iPad，iPhone等上工作。

我也有内容（图像，子div和文本）坐在这两个div中，但我不知道如何处理这个，因为我对jQuery没用。

有人可以帮我解决这个问题吗？

Answer 1

你不需要jQuery（至少是定位）。 CSS有足够的技巧。

请勿使用绝对定位，请使用fixed：

#div-1, #div-2 {position:fixed;}
#div-1 {left:40px; bottom;40px;}
#div-2 {right:40px; bottom;40px}

对于position:fixed，left，right，top和bottom属性指的是定位对象的相应边缘距视口的相应边缘的距离。

...所以你在哪里接受你的div并不重要。只需将它们附加到身体上：

var myDivsHtml = howeverYouGetYourDivs();
$('body').append(myDivsHtml)

Answer 2

我相信你正在寻找固定的定位而不是绝对定位。

只需使用CSS

.div1{
   position:fixed;
   bottom:40px;
   left:40px;
}
.div2{
   position:fixed;
   bottom:40px;
   right:40px;
}

Answer 3

试试这个：

$(function(){
    var $body = $("body");
    $("<div/>").css({
        "position":"fixed",
        "bottom":"40px",
        "left":"40px"
        }).appendTo($body);
    $("<div/>").css({
        "position":"fixed",
        "bottom":"40px",
        "right":"40px"
        }).appendTo($body);
});

获取浏览器宽度和高度追加divs jQuery

3 个答案: