jQuery - запуск функции до document.ready ... но не слишком рано - PullRequest
Новая
       3

jQuery - запуск функции до document.ready ... но не слишком рано

4 голосов
/ 04 июля 2010

У меня есть страница, которая содержит div, который должен быть изменен через JS при загрузке страницы. Для этого я присваиваю ему «ширину по умолчанию» 760 пикселей, а затем запускаю следующий код: 

function resizeList()
{
    var wlwidth,iwidth,nwidth;
    wlwidth = document.body.clientWidth - 200 - 60;
    iwidth = 320;
    nwidth  = Math.floor(wlwidth / iwidth) * iwidth;
    $('#list').css('width',nwidth);
}

$(document).ready(function(){
    // if we're looking at a list, do the resize-thing, now and on window resize
    if (window.location.pathname.toString().split('/')[1] == "list")
    {
        resizeList();
        window.onresize = resizeList;
    }
});

Однако загрузка страницы может занять некоторое время, так как #list div содержит много изображений. Таким образом, div расширяется, чтобы заполнить правильную ширину после того, как весь контент завершил загрузку. Я не могу просто извлечь его из функции $(document).ready, иначе он выдаст ошибку, сообщив, что document.body не определено.

Есть ли способ изменить размер элемента #list перед загрузкой всего его содержимого?

Редактировать
Пожалуйста, смотрите: http://www.google.com/images?q=whatever
Они добились того, что я пытаюсь сделать успешно. Список корректно измеряется сразу при загрузке страницы, а затем заполняется. Вы можете сказать, что они измеряют все через JS, изменив размер окна и наблюдая за плавным движением элементов. К сожалению, Google's JS не самый простой в мире текст для чтения вздох

1 Ответ

4 голосов
/ 04 июля 2010

Он работает, как только может, $(document).ready - это событие, которое происходит, когда dom завершает рендеринг.

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

...