Страницы предварительной загрузки JQuery - PullRequest
Новая
       7

Страницы предварительной загрузки JQuery

0 голосов
/ 25 ноября 2011

Моя проблема довольно проста, я хотел бы предварительно загрузить страницы перед их отображением в div

У меня есть основной div на моей странице индекса: # data_div

я загружаю страницыс большим количеством изображений в этот Div ... (не только изображения, но и много разметки)

я использую другой div для предварительной загрузки страницы, этот div не виден (но не скрыт, чтобы сохранить хорошее форматированиеданные загружены): #data_loading;

Я использую div для загрузки символа: # wait_div

Я думаю, мне нужен ajax-эквивалент нагрузки JQUERY (событие, а не метод загрузки), но я могу 't установить это событие в div (...), поэтому мне нужно другое решение 

        $.address.change(function(event) {
                    $("#wait_div").show();

                    if(event.value == "/") {
                        $.address.value("index.php");
                    } else if(event.value.substr(1, 5) == "Datas") {
                        $("#data_loading").load(event.value, {
                            'ajax' : 'true'
                        },function(){

    /* i would like that this occur only when the page is fully loaded 
(including image and scripts) inside the temp div */
                           $("#data_div").children().remove();
                           $("#wait_div").hide();
                           $("#data_loading").children().appendTo($("#data_div")).fadeIn(1000);
                                //alert("done");
                            });
                        });
                    }
                });

Ответы [ 2 ]

1 голос
/ 25 ноября 2011

Проверка это ответ на мой вопрос

Вот как вы знаете, когда все изображения загружены, вы можете дать класс изображениям внутри вашего временного div и сделать что-то подобное на новой странице: 

  $(document).ready(function(){
    var imgs = $("img.tempDivImages"), cnt = imgs.length;

    imgs
    .load(function(){
      if(!--cnt) {
        /* all images loaded */
        /* now call the function you want when everything is loaded*/
      }
    })
    .error(function() { /* whoops an image failed to load */});
  });

Вот как вы получаете функцию calla или делаете что-то, когда все внутри вашего временного div загружено.

0 голосов
/ 25 ноября 2011

Я ответил на этот вопрос в другой вопрос (не jQuery, а JavaScript):

Примечание. Вы можете добавить загрузочное сообщение в HTML и скрыть его в конце функции preload ().

JavaScript 

function preload() {
    imageObj = new Image();
    images = new Array();
    images[0] = 'img/1.png';
    images[1] = 'img/2.png';
    images[2] = 'img/3.png';
    images[3] = 'img/4.png';
    images[4] = 'img/5.png';

    for (i = 0; i <= 4; i++)
        imageObj.src = images[i];
}

HTML 

<body onload="preload();">
    ....

    <!--[if IE]>
        <div id="preload">
            <img src="img/1.png" width="1" height="1" alt="" />
            <img src="img/2.png" width="1" height="1" alt="" />
            <img src="img/3.png" width="1" height="1" alt="" />
            <img src="img/4.png" width="1" height="1" alt="" />
            <img src="img/5.png" width="1" height="1" alt="" />
        </div>
    <![endif]-->
</body>

CSS для IE 

#preload {
   position: absolute;
   overflow: hidden;
   left: -9999px; 
   top: -9999px;
   height: 1px;
   width: 1px;
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...