2010-04-08 32 views
1

У меня есть два div элементы, которые являются близнецами (то есть их размеры и содержимое идентичны). Я хочу переместить эти div-ы над другим, так что их углы находятся в одинаковых координатах. То, что я пытаюсь сделать, это:переместить один div над другим

var offset = $('div#placeholder').offset(); 
$('div#overlay').css('position', 'absolute').css('left', offset.left + 'px').css('top', offset.top + 'px') 

- но это вызывает наложение быть точно (или почти точно, с точностью субпикселей в счет) 16px ниже заполнителем (ниже, т.е. overlay_top = placeholder_top + 16px).

Я знаю, что смещения() дает позицию по отношению к документу, и положения: абсолютное наборов положения относительно тела элемента, но компенсируя тела смещения() не очень помогает (Я получаю 8px смещение, равные поля):

offset.top -= $('body').offset().top; 
offset.left -= $('body').offset().left; 

Кроме того, компенсируя тела краев (в случае, если они были разные, что смещения() не помогли, так как они были установлены на 8 пикселей).

Знает ли кто-нибудь, что я делаю неправильно здесь?

ОБНОВЛЕНИЕ: Посмотрите на here - Я получаю тот же результат в FireFox 3.6.3 и Opera 10.10.

+1

Можете ли вы показать демо? – SLaks

+0

Не уверен, что это то, что вам нужно, но попробуйте добавить некоторые свойства z-index: 1; (2, 3 и т. Д.) В ваш CSS. – Kyle

ответ

1

Я подозреваю, что в CSS-стиле применяется правило CSS/class/name/element. Я предлагаю вам попробовать установить margin/padding на элементе на 0 через javascript. Вы также можете использовать WebDeveloper или FireBug и проверять вычисленные стили на элементе после повторного позиционирования, чтобы увидеть, какие стили применяются и откуда.

+0

Я создал пустую страницу и все еще сумел воспроизвести проблему. Но когда я переключился на позиционирование дочерних элементов div (т. Е. Входов), все начало работать отлично. Я до сих пор не знаю, почему, но у меня нет времени, чтобы исследовать это дальше. –

Смежные вопросы