Порядок инициализации jQuery

Question

Я создаю страницу, где я хочу использовать скрипт Galleria (http://devkick.com/lab/galleria/) и виджет Accordion jQuery, чтобы скрыть разные категории миниатюр галереи. В моей инициализации я написал, как было предложено руководствами оба сценария:

<script type="text/javascript"> 
     jQuery(function($) { 
     $('ul.gallery').galleria({ 
     insert: "#image" 
     }); 

     $("#thumbs").accordion(); 

     }); 
</script> 

galleria() функция создает эскизы и присваивает соответствующие размеры для них. Затем функция accordion() присваивает свои стили и сворачивает текущие невидимые элементы. С приведенным выше кодом у меня есть проблема с тем, что некоторые уменьшенные изображения становятся невидимыми из-за нулевого размера.

Если я помещал предупреждения, прежде чем миниатюрам назначаются их размеры в функции galleria(), я вижу, что для изображений, которые находятся внутри невидимых страниц аккордеона, их контейнер имеет нулевые размеры в этой точке. Это очень странно для меня, потому что я думал, что эти функции выполняются последовательно, а accordion() не вызывается до завершения galleria().

Что более странно, если я поставил предупреждение перед функцией аккордеона, тогда все обрабатывается в правильном порядке.

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

Answer 1

Это всего лишь предположение, но я предполагаю, что это имеет какое-то отношение к скриптам, запущенным до загрузки изображений. Это, по-видимому, объясняет, почему alert() перед функцией аккордеона заставляет вещи работать. Это дает изображениям возможность загрузить.

Если это правильно, вы должны использовать обработчик событий jQuery's load(), чтобы обеспечить полную загрузку изображений.

Docs для нагрузки(): http://api.jquery.com/load-event/

Answer 2

Я предположил бы, что состояние гонки может быть в том, что все изображения не могут быть загружены еще раз было их Galleria добавило. Это приведет к тому, что гармоническая функция будет считать образы равными нулю на ноль.

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

Если вы хотите быть уверены в выполнении заказа, загляните в firebug и console.log вместо использования предупреждений, которые не блокируют выполнение сценария, как предупреждение.

Что касается вашей основной проблемы, я бы посмотрел, есть ли у galleria функциональность обратного вызова, чтобы обеспечить загрузку всех изображений до их перемещения.