两个固定div - 左右

我想在我的网页上创建两个固定div。首先应该在左边，第二个在右边。我创建了一些代码，但它并不完美。两个固定div - 左右

演示here

我不知道如何纠正它。任何解决方案

2012-07-09 Jarek

在我看来，你确实需要3周的div。一个在左边，一个在右边，一个在中间来保存文本内容。 – 2012-07-09 13:32:22

演示页面上的jquery代码被设置为以页面行为的方式工作。您是自己编写代码还是希望将其调整为您的需求？ – Chandu 2012-07-09 13:32:34

没有必要为此做jQuery。 – undefined 2012-07-09 13:33:20

当页面滚动，你设置一个position:fixed您#aside和#bside元素，通过应用类fixed和fixed2。

由于当应用。查阅全文以#aside和#bside的position:fixed，取出来凭证流的，该元件#main如预期到左是浮动的。

为了避免改变当前的代码，一个简单的解决方案将是使用一类特定样式设置为您#main元件，并且具有施加在需要该类：

参见本实施例working Fiddle。

CSS

.fixMiddle { 
    position: relative; 
    left: 190px;   /* your #aside width+padding+border */ 
}

jQuery的

if ($('#aside').hasClass('fixed')) { 
    $('#main').addClass('fixMiddle'); 
} else { 
    $('#main').removeClass('fixMiddle'); 
}

2012-07-09 15:31:48 Zuul

非常感谢。这很好。 – Jarek 2012-07-09 16:47:10

通过提供一个margin到#main，它等于固定列的宽度，它将保持该区域不向后向左移动。当您将position:fixed应用于列时，它会将这些元素从文档流中取出。

由于position:fixed动态施加到列（通过使用JS的），则还可以考虑应用到margin#main动态以及，如果仅用于定时目的。

2012-07-09 13:32:30

回答