Я хотел бы создать два фиксированных div на моей веб-странице. Сначала должен быть слева, второй - справа. Я создаю код, но он не работает идеально.Два фиксированных divs - справа и слева
Demo here
Я понятия не имею, как ее исправить. Любые решения?
Когда прокручивает страницы, вы установив position:fixed своим #aside и #bside элементов, применяя класс fixed и fixed2.
Поскольку position:fixed, когда aplied к #aside и #bside, берет их из потока документов, элемент #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');
}
Большое вам спасибо. Это отлично работает. – Jarek
Предоставляя margin до #main, равный ширине фиксированных колонок, он будет удерживать эту область от щелчка назад влево. Когда вы применяете position:fixed к столбцам, они берут эти элементы из потока документа.
Поскольку position:fixed применяется к колонкам динамически (за счет использования JS), вы можете также рассмотреть вопрос о применении к margin#main динамически, а также, если для целей синхронизации только.
Мне кажется, что вы на самом деле нужно 3 дивы. Один налево, один направо и один на середине, чтобы удерживать текстовое содержимое. –
Код jquery на вашей демонстрационной странице настроен так, чтобы работать так, как ведет себя страница. Вы сами пишете код или хотите адаптировать его к вашим потребностям? – Chandu
не нужно jQuery для этого. – undefined