как загрузить динамически вставленный IMG сначала - PullRequest
3 голосов
/ 05 октября 2010

Я создаю заставку для веб-сайта с анимацией jquery. Моя проблема: иногда (до того как страница и изображения кэшируются браузером) изображения загружаются в порядке, который ухудшает качество анимации.

Хорошо, вот что я сделал: контейнерный дивизион имеет следующий CSS: background:url(images/colorcity.png) если js включен, я накладываю шкалу оттенков серого <img> на colorcity, прозрачность которого анимируется до 0 для приятного эффекта "плавного перехода к цвету". для этого я использую: $("#container").prepend('<img src="images/greycity.png" class="grey" />')

То, что я пытался сделать, это каким-то образом заставить это предварительно добавленное изображение отображаться первым на странице, поскольку оно будет «скрывать» другие изображения, используемые в анимации. К сожалению, все мои попытки потерпели неудачу.

Я предполагаю, что это обычная проблема и, вероятно, повторяющийся вопрос, но я не смог найти ответ через час или два поиска. Так что извините, если я нуб лол.

Спасибо заранее за любую помощь.

Страница: http://roughgiraffed.com/barrandbarrbags/

1 Ответ

1 голос
/ 05 октября 2010

Попробуйте включить это в верхней части страницы или рядом с ней:

<img src="images/greycity.png" style="display: none;" />

Это должно заставить изображение загружаться довольно рано. Если проблема по-прежнему возникает, используйте анимацию в обратном вызове load() вместо ready(), чтобы обеспечить загрузку всех ваших изображений.

Кстати, очень классная страница (и, похоже, она отлично работает в Firefox).

...