位置DIV与可变高度

现在的问题是：可以说我有这样的事情：位置DIV与可变高度

<div id="leftcontainer"> 
    <div id="top" style="position:fixed"></div> 
    <div id="below"></div> 
</div>

而且我想有#below DIV，在#top返回DIV下方，但不使用margin-top，因为#top div的大小不同。此外，#below div可以在大小上有所不同，并且应该在#top div下滚动。

有谁有一个想法如何实现的？ Greets - Chris

来源

2011-07-04 Christian Romeni

你需要实现的jQuery这个 – sandeep

我有jQuery的，究竟是从那里要走的路？ –

关于以前的评论，你不*需要jQuery为此 - 它可以用计划的JavaScript和CSS来完成。 jQuery提供了跨浏览器的便捷方法，使其更快实施。 – hemp

这是与jQuery 如果页面呈现后顶div的高度是固定的相当简单。

$(document).ready(function() { 
    $('#below').css('top', $('#top').outerHeight()); 
});

这将指定下面元素的css top属性等于top元素的全部高度。其他布局因素可能会导致不能成为top的正确值，在这种情况下，您将不得不确定正确的方式来标识最高值，但是主体是相同的，并且在简单的情况下，这将无需修改即可使用。

来源

2011-12-24 08:53:42 hemp

我已经创建了这个jquery插件来解决类似的问题，我在哪里有一个中间容器（表格数据），并且我希望头部在列表滚动时修复到页面顶部（该列表是可变大小）。其中一个问题是，当标题变得固定时，它下面的内容会跳到页面上（不好）。这个插件补偿了“固定”元素，并允许它下面的内容定位和滚动，因为它应该。

这里是连结此jquery插件，其可以解决这个问题：

https://github.com/bigspotteddog/ScrollToFixed

此插件的描述如下：

该插件用于固定元件到顶端如果该元素已经滚动到视图外，则垂直;但是，它确实允许元素继续向左或向右移动水平滚动。

给出选项marginTop，元件将停止垂直向上一次垂直滚动已到达目标位置移动;但是，当页面向左或向右滚动时，元素仍然会水平移动。一旦页面向下滚动通过目标位置，元素将恢复到其在页面上的原始位置。

该插件在Firefox 3/4进行了测试，谷歌Chrome 10/11，Safari浏览器5和Internet Explorer 8/9。

使用您的具体情况：

<script src="scripts/jquery-1.4.2.min.js" type="text/javascript"></script> 
<script src="scripts/jquery-scrolltofixed-min.js" type="text/javascript"></script> 

$(document).ready(function() { 
    $('#top').scrollToFixed(); 
});

来源

2011-08-29 18:05:20 bigspotteddog

位置DIV与可变高度

回答

相关问题