div 中的 position/offset 返回为 0

Question

这是我的css圈子

#balloon-circle {
    width: 150px;
    height: 150px;
    background: rgb(255,100,100);
    -moz-border-radius: 150px;
    -webkit-border-radius: 150px;
    border-radius: 150px;
    top:5px;
}

这里是 javascript:

var bc = document.getElementById("balloon-circle");
var bctop = bc.offsetTop;
console.log(bctop);

我也试过：

var bc = $("#balloon-circle");
var position = bc.position();
console.log(position.top);

但是，它们都return 0 作为最高排名值。

这是为什么？

Answer 1

您需要将位置设置为"relative"或"absolute"才能使用top。

http://www.w3schools.com/css/css_positioning.asp

#balloon-circle {
    width: 150px;
    height: 150px;
    background: rgb(255,100,100);
    -moz-border-radius: 150px;
    -webkit-border-radius: 150px;
    border-radius: 150px;
    position: relative;
    top:5px;
}

div 中的 position/offset 返回为 0

position/offset of div returning as 0

javascript

css

position

offset