JQuery 'fadeIn' запускается слишком рано, прежде чем образы будут загружены - PullRequest
0 голосов
/ 06 марта 2012

Я добавляю последний штрих на сайт портфолио моего друга (с использованием WordPress), но у меня возникла проблема с простым переходом на страницу JQuery с эффектом fadeIn.

Вот ссылка на сайт: (предупреждение: NSFW) http://www.alexdebrabant.com/front/

В разделе «ПРОЕКТЫ» я использую цикл Jquery для создания слайд-шоу со всеми изображениями в посте.Работает отлично.Но в разделе «ПОРТРЕТЫ» ситуация несколько иная, поскольку у меня только одно изображение на пост.Таким образом, кнопки PREV NEXT переводят посетителя на новый пост, поэтому новая страница должна загружаться каждый раз.Моя идея состояла в том, чтобы попытаться имитировать слайд-шоу из раздела «ПРОЕКТЫ», используя какой-то переход перехода.На данный момент у меня есть только очень базовый эффект исчезновения.Моя проблема в том, что, если изображения не кэшируются, эффект fadeIn срабатывает слишком рано, прежде чем загрузка изображения будет завершена.

Я новичок в JQuery, и я подозреваю, что должно быть простое решение, но я могуКажется, его не найти.

Кроме того, если кто-то из вас знает об эффекте Jquery, который лучше имитирует / копирует слайд-шоу из раздела «ПРОЕКТЫ», это также было бы замечательно.Возможно, эффект затухания страницы (если он существует) или затухание / затухание.

Любая помощь будет принята с благодарностью.

Вот код:

<!-- contentload -->
<script type="text/javascript">
$(document).ready(function(){

    $('#content').fadeIn(500);

});
</script>
<!-- contentload -->

<style>
#content {display: none;}
</style>

Ура!

Том

Ответы [ 2 ]

5 голосов
/ 06 марта 2012

Используйте $(window).load() или $('img').load() вместо $(document).ready().Весь смысл из document.ready состоит в том, что он срабатывает, когда DOM готов для запросов, не , когда загружена вся страница.

0 голосов
/ 06 марта 2012

попробуйте использовать jQuery load вместо document.ready

...