JQuery вставляет слой над существующим содержимым
Я пытаюсь создать новый слой поверх существующего контента на моем сайте при нажатии ссылки / кнопки. Я использую jquery, но код, который у меня есть, не работает должным образом.
Вот что у меня есть:
$(document).ready(function(){
$("#button").click(function () {
$("#showme").insertAfter("#bodytag")
$("#showme").fadeIn(2000);
});
});
Эффект, которого я добиваюсь, заключается в том, чтобы <div id = "showme">...</div> появлялся сразу после #bodytag. У <div id = "showme">...</div> z-index выше, чем у всего остального на сайте, поэтому он должен появляться над контентом сразу после #bodytag.
Спасибо за помощь.
Ответы 2
Убедитесь, что #showme имеет другой position, а не static.
Мне кажется, что для получения желаемого эффекта div, в который вы вставляете #showme, должен быть position: relative, а #showme должен иметь position: absolute. Абсолютное позиционирование выводит элемент из потока документов, позволяя ему располагаться над содержимым.
Кроме того, два совета - $ () - это ярлык для $ (document), и вы можете связать команды jQuery:
$().ready(function(){
$("#button").click(function () {
$("#showme").insertAfter("#bodytag").fadeIn(2000);
});
});
Спасибо tags2k. Решение было таким, как вы описали. Добавление position: absolute к содержимому, которое я вставлял, сделало это. Также - спасибо за ярлыки - я новичок в jquery, поэтому это было очень оценено.
Вы хотите сказать, что он продвигает контент, который уже находится под тегом #bodytag, дальше вниз? Или он появляется за уже существующим контентом?