DIV的相对定位

Question

有一个名为"dvUsers“的div。这里有一个锚标签"lnkUsers“。

当用户点击anchortag时，div必须像弹出的div一样在其下方打开。

另外，div的相对位置应该保持为窗口调整大小和全部。如何使用javascript/jquery做到这一点？

Answer 1

也许你应该找一个像overLIB：http://www.bosrup.com/web/overlib/ !-)这样的预制脚本

Answer 2

我更喜欢将这两个放在父div中，如下所示：

<div id="container">
    <a id="lnkUsers" href="#">Users</a>
    <div id="dvUsers" style="display: none;">
        <!-- user content... -->
    </div>
</div>

这些元素的CSS为：

#container{
    /* ensure that #dvUsers is positioned relatively to this element */
    position: relative;
}
#dvUsers{
    position: absolute;
    /* this value should be based on the font-size of #lnkUsers */
    top: 30px;
    left: -10px;
}

这样可以确保div相对于链接的位置正确。(对于这个问题，我假设父div要么是"text-align: left“，要么是浮动的)

javascript看起来像这样：

$(function(){
    $('#lnkUsers').click(function(){
        $('#dvUsers').slideToggle();
    });
});

Answer 3

$(document).ready(function(){ $("#lnkUsers").click(function(){ $("#dvUser").show("slow"); });

首先应该对dvUser应用style=：无，使其不可见。