Фиксированное позиционирование с отступом - PullRequest
3 голосов
/ 16 марта 2012

Я использую jQuery для исправления рекламного блока, когда пользователь прокручивает страницу до целевого элемента div.Однако у меня есть установка, где мне нужно, чтобы фиксированный элемент был перемещен на 20 пикселей влево.У меня есть div, который оборачивает его с отступом вправо: 20px;но это, кажется, переопределяется, как только jquery добавляет класс фиксированной позиции.У меня есть только там, где фиксированная позиция топ 10px.Я не хочу, чтобы это было исправлено влево или вправо, потому что я хочу, чтобы оно было зафиксировано на месте.

Странная вещь заключается в том, что div-обертка с отступом прекрасно работает в Firefox даже при фиксированном позиционировании.В Chrome, однако, отступы игнорируются, и блок смещается на 20 пикселей.Как я могу зафиксировать этот элемент в верхней части страницы и «зафиксировать» его на оси X?Можно ли использовать два разных стиля позиционирования?(Фиксированный и абсолютный?)

Редактировать:

Вот jQuery, который я использую:

;(function($){
$(window).scroll(function() {
var styledDiv = $('#styledDiv'),
    targetScroll = $('#float').position().top,
    currentScroll = $('html').scrollTop() || $('body').scrollTop();

styledDiv.toggleClass('fixedPos', currentScroll >= targetScroll);
});

})(jQuery);

, и я попытался обернутьStyledDiv с div я назвал "adside" с этим CSS:

#adside {padding-right:20px;}

Вот HTML:

<div id="float"></div>
<script src="http://takemydough.com/wp-content/themes/iloveit/js/smartbanner.js"      type="text/javascript"></script>
<div id="adside">
<div id="styledDiv">
AD CODE
</div>
</div>
</div>

1 Ответ

0 голосов
/ 17 марта 2012

У вас есть дополнительный тег в вашем HTML.Попробуйте удалить это и посмотреть, если это что-то делает.Тем временем я поиграю с ним в jsfiddle.

...