在jQuery中,如何设置元素的"顶部,左侧"属性,其中位置值相对于父级而不是文档？

Question

.offset([coordinates])method设置元素的坐标,但仅相对于文档.那么我如何设置元素的坐标但相对于父元素的坐标？

我发现该.position()方法只获得相对于父级的"top,left"值,但它没有设置任何值.

我试过了

$("#mydiv").css({top: 200, left: 200});

但不起作用.

Answer 1

要设置相对于父级的位置,您需要设置position:relative父级和position:absolute元素的位置

$("#mydiv").parent().css({position: 'relative'});
$("#mydiv").css({top: 200, left: 200, position:'absolute'});

这是有效的,因为position: absolute;相对于最接近的定位父级(即,具有除默认值之外的任何位置属性的最近父级)的位置static.

Answer 2

$("#mydiv").css('top', 200);

$("#mydiv").css('left', 200);

Answer 3

你可以试试jQuery UI的.position方法.

$("#mydiv").position({
  of: $('#mydiv').parent(),
  my: 'left+200 top+200',
  at: 'left top'
});

检查工作演示.

Answer 4

我发现如果传递的值是字符串类型,则必须后跟'px'(即90px),其中如果值是整数,它将自动附加px.宽度和高度属性更宽容(两种类型都有效).

var x = "90";
var y = "120"
$(selector).css( { left: x, top: y } )        //doesn't work
$(selector).css( { left: x + "px", top: y + "px" } )        //does work

x = 90;
y = 120;
$(selector).css( { left: x, top: y } )        //does work

Answer 5

动态页面的代码偏移量动态

var pos=$('#send').offset().top;
$('#loading').offset({ top : pos-220});