Как сохранить абсолютно позиционируемый элемент непосредственно над положением встроенного?

Question

Это вопрос до How can I stop an IFrame reloading when I change it's position in the DOM?, если вы хотите фон.

У меня есть встроенный div <div id="leaderboard-slot"></div> (с фиксированной шириной и высотой) и еще один div («leaderboard-loader») далее на странице с фактическим содержимым для этого div.

По различным причинам (см. Предыдущую тему), я не могу просто сделать appendChild или подобное.

Вместо этого я надеюсь разместить позиционирующую панель-загрузчик таким образом, чтобы она занимала пространство «зарезервировано» слотом лидеров. Я использовал некоторые методы jQuery для этого:

var loader = $('leaderboard-loader'); 
var dest = $('leaderboard-slot'); 
var pos = dest.getPosition(); 
loader.setStyle('top', pos.y + 'px'); 
loader.setStyle('left', pos.x + 'px'); 

, который я запускаю при загрузке и изменении размера документа. Однако, если другие элементы внутри страницы вызывают перекомпоновку, то целевой div перемещается, но загрузчик этого не делает.

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

Любая помощь будет высоко ценится - спасибо :)

Answer 1

Я начинаю жалеть my answer в настоящее время. Надеюсь, вы можете найти что-то лучшее, чем обходное решение абсолютного позиционирования. Но в духе kludgey-решений вы можете вызвать сценарий перестановки на таймере. вздох.

Answer 2

Если я правильно понимаю ваш вопрос, нет необходимости в JavaScript. Просто положите leaderboard-loader перед тегом leaderboard-slot, дайте ему position: absolute и идентичную ширину и высоту. Если слот является нормальным элементом, загрузчик будет плавать над ним и отлично его покрывать.

<div id="leaderboard-loader"></div><div id="leaderboard-slot"></div> 

Answer 3

Вы можете поместить их как в том же относительном положении, 0 margin div, с временным индексом div z, индексированным поверх медленного загрузчика.

Сделать их как абсолютными позициями в родительском, не в окне, так и в 0: 0.

Вы можете использовать непрозрачность и исчезать один в, как вы выцветаете другую из, или просто поменять местами видимость: скрытая и видимые для двух элементов, когда вы будете готовы ..