. загрузить <div id = 'slider'> в пустой div работает нормально, но создает <div id = 'slider'> внизу страницы, не знаю почему

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

рассматриваемая страница - http://new.pudle.co.uk/, если вы нажмете на одну из розовых плиток, она откроет загрузку ползунка и в то же время поместит пустой div внизу.

Я использую это

google.setOnLoadCallback(function() {
$("#pegasus-tile, #o-w").click(function(){
    $("#proj-content").load("projects/pegasus.html", function(){

        $('<div id="slider" class="nivoSlider"></div>').appendTo($('body'));
        $('#slider').nivoSlider({effect: 'sliceUpDown'}),

        $("#close").click(function(){
        $("#proj-content").load("projects/blank.html"),


        $("#next-pegasus").click(function(){
        $("#proj-content").load("projects/bgapp.html");


            }); 
        });
    });
  });
});
Источник

2 ответа

Решение

Я не думаю, что вам нужна линия

$('<div id="slider" class="nivoSlider"></div>').appendTo($('body'));

потому что у вас есть

<div id="slider" class="nivoSlider">
<img src="images/projects/pegasus property/1.png" width="490" height="400" />
<img src="images/projects/pegasus property/2.png" width="490" height="400" />
</div><!--slider close-->

в projects/pegasus.htmlследовательно, появляются два ползунка, а тот, который добавлен jquery, находится внизу.

Вы добавили это, потому что nivoSlider не работал без этого или что-то?

Также я заметил, что у вас есть google.setOnLoadCallback(function() { для каждой розовой коробки... Это может оказаться не очень удобным для обслуживания (хорошо, я полагаю, вы только что тестировали в данный момент, но лучше сделать все правильно в первый раз. Возможно, добавьте общий класс к каждой розовой коробке, затем используйте его идентификатор, чтобы определить, какой контент загрузить.

Источник

Что это

$('<div id="slider" class="nivoSlider"></div>').appendTo($('body'));

делает.. добавляет ползунок внизу корпуса..

Чего ты ожидал? (о, и вы добавляете по одному на каждый клик..)

Источник
Другие вопросы по тегам