如何将div动态定位在另一个下方？
我正在尝试使用jQuery来检测div（ #olddiv ）的位置，所以我可以使用该位置在其下方放置另一个div（ #newdiv ）。 2个div的右边界对齐（右边框）。
我正在尝试将#olddiv底部和右侧位置用作#newdiv顶部和右侧边框。 我已经使用过这段代码了，但它没有用。 知道我做错了什么吗？
var right = $('#olddiv').position().right; var top = $('#olddiv').position().bottom; $('#newdiv').css('top', right); $('#newdiv').css('right', top);
另外，我不确定我的position是否合适。 我认为这可以通过position或offset ，但我不确定：
$('#ID').position().left $('#ID').offset().left
谢谢
我已经使用offset（）来动态定位元素。 试试这个：
var offset = $('#olddiv').offset(); var height = $('#olddiv').height(); var width = $('#olddiv').width(); var top = offset.top + height + "px"; var right = offset.left + width + "px"; $('#ID').css( { 'position': 'absolute', 'right': right, 'top': top });
如果您需要在用户调整窗口大小时进行缩放，也不要忘记将其绑定到window.onresize事件。
更新：另一个想法 – 这必须绝对定位吗？ 为什么不直接在DOM中插入div？
$('#olddiv').after($('#ID').html());
然后确保它们的宽度相同。
有一个非常酷的插件由jQuery UI团队开发，有助于定位 。
让你做这样的事情：
$(".menu").position({ my: "left top", at: "left bottom", of: ".menubutton" });
我在我制作的网站中使用它，在某个位置显示div，总是相对于另一个div并且总是相对于浏览器窗口的尺寸（即使你手动拉伸它）。
这是代码：
// function to place the div var newdiv = function () { var o = $('#olddiv').offset(); var h = $('#olddiv').height(); var w = $('#olddiv').width(); $('#newdiv').css({'top': o.top, 'left': o.left, 'width': w, 'height': h }).show(); } // listen the window changes and correct the newdiv position $(window).resize(function(){ newdiv(); }); // display the newdiv after DOM is loaded, or whenever you want newdiv();
请注意，您可能需要在上面的css中添加另一个变量，如margin，padding等，以便获得正确的位置，或者甚至手动将值添加到顶部和左侧，以防新div不完全像旧的。
看起来像拼写错误，修复：
'top', right 'right', top
有帮助吗？
div必须绝对或相对定位，以便此代码也能正常工作。