将div放在表单中的另一个元素之后

时间:2012-07-07 17:11:46

标签: jquery css position css-position

您好我想在表单中的字段集之后将absoulte定位为div但是表单有另一个容器元素并且字段的高度不固定,它正在根据其中的内容进行更改。 我用jQuery做了这个但是不起作用。哦,我不能把div放在表单中,因为div包含另一种形式。

<script>
  $(function(){
  var heightOfform = document.getElementById("form").scrollHeight;
  var heightOffsomethingafter = document.getElementById("somethingafter").scrollHeight;
  document.getElementById("divtoposition").css('top', (heightOfform-heightOffsomethingafter)+'px');
  });
</script>
<style>
#all {position:relative;}
#divtoposition {position:absolute;}
</style>
<div id="all">
<div id="divtoposition"><form></form></div>
<div id="formcontainer">
  <form id="form">
    <fieldset id="afterthis"></fieldset>
    <div id="somethingafter"></div>
  </form>
</div>
</div>

1 个答案:

答案 0 :(得分:0)

我认为这是一个复杂的答案,但你能解释一下为什么你想要定位的div有一个形式吗?它有什么作用?可以用另一种方式吗?你不能把表格放在一个表格中,这样就可以了。您可以将DivToPosition的顶部设置为100px,然后让jquery获取字段集的高度。如果该字段集的高度为150px,则可以将Js加100到100,现在DivToPosition的高度为250px;

 <script>
$(function(){
var divtopositionTop = 100,
fieldsetHeight = $('#afterthis').height();
   $('#divtoposition').css('top', divtopositionTop+fieldsetHeight+'px');
})
</script>

只是一个例子可以做到。必须在doc准备就绪,以便设置高度。但是,这可能会导致快速更换位置,因为当应用样式时,elem会从1个位置移动到另一个位置。