Question

在我的CSS中，我使用CSS top 0px将元素的位置设置到页面顶部。

如何确定浏览器底部的位置？（我想强制一个元素到页面底部，即底部可见）。

Answer 1

你应该可以使用css：bottom：0px;

Answer 2

浏览器的底部位置是从顶部开始的距离：0到底部，等于客户端文档的高度。它很容易计算如下：

        $(document).ready(function() {
        var bottomPosition = $(document).height();
        alert(bottomPosition);
    });

希望这有助于

Answer 3

以下是我需要保留在页面底部的基本项目的方法。

首先是JavaScript。 “centerBottom”功能是动作发生的地方。

<script type="text/javascript">
/**
 * move an item to the bottom center of the browser window
 * the bottom position is the height of the window minus
 * the height of the item
 */
function centerBottom(selector) {
    var newTop =   $(window).height() - $(selector).height();
    var newLeft = ($(window).width()  - $(selector).width()) / 2;
    $(selector).css({
        'position': 'absolute',
        'left': newLeft,
        'top': newTop
    });
}

$(document).ready(function(){

    // call it onload
    centerBottom("#bottomThing");

    // assure that it gets called when the page resizes
    $(window).resize(function(){
        centerBottom('#bottomThing');
    });

});
</script>

一些样式可以清楚地说明我们正在移动的内容。如果一个人不知道高度和宽度，那绝对是一件非常棘手的移动物品。如果未指定，DIV的宽度通常为100％，这可能不是您想要的。

<style type="text/css">
body {
    margin: 0;
}
#bottomThing {
    background-color: #600; color: #fff; height:40px; width:200px;
}
</style>

页面正文：

<body>
<div id="bottomThing">
    Put me at the bottom.
</div>
</body>

Answer 4

当用户向下滚动页面时，您是否希望某些项目停留在浏览器窗口的底部;或者某个项目“粘贴”到页面底部，无论在哪里？

如果你想要＃2，可以找到一个跨浏览器的CSS方法here。

在jQuery中，如何获得浏览器的底部位置？

4 个答案: