WedX - журнал о программировании и компьютерных науках

Как я могу скрыть слайд-шоу фотографий, пока оно полностью не загрузится?

У меня есть слайд-шоу фотографий Nivo Slider на главной странице с использованием Wordpress CMS. Я потратил некоторое время на оптимизацию сайта (меньше кода, JS внизу, асинхронная загрузка и т. д.). Тем не менее, у меня все еще есть проблемы с небрежной загрузкой больших фотографий.

В частности, фотографии загружаются не в правильном порядке, и вы можете видеть загрузку каждой фотографии. Когда слайд-шоу загружает фотографии, последняя фотография загружается первой, а затем быстро переходит к первой фотографии при загрузке. Я лучше скрою слайд-шоу Nivo, пока не загрузятся все фото (максимум 4).

Мы используем jQuery в качестве нашей JS-библиотеки, и она загружается в wp_head. Какой код я могу использовать для задержки показа этого слайд-шоу или есть лучший способ приблизиться к этому?

javascript jquery slideshow
31.01.2011

  • используйте фотографии с самым низким разрешением для быстрой загрузки. 31.01.2011
  • К сожалению, у меня нет прямого контроля над фотографиями. Каждая фотография весит около 70 КБ, имеет разрешение 900x410 и очень насыщенные цвета. 31.01.2011

Ответы:


1

Вместо использования $(document).ready( /*...*/ ); для запуска слайд-шоу используйте $(window).load( /*...*/) для запуска слайд-шоу после завершения загрузки изображений.

Я также предлагаю скрыть изображения слайд-шоу с помощью css, а затем отображать их только в событии $(window).load().

31.01.2011
  • Итак, первая строка читается как jQuery(document).ready(function($) { и вы предлагаете изменить ее на jQuery(window).load(function($) {? Правилен ли этот синтаксис? 31.01.2011
  • @Micah, да, именно так =) 31.01.2011
  • Хм, хорошо. У меня скрипт загружается непосредственно под wp_head, но, похоже, это не влияет на загрузку слайд-шоу. Я по-прежнему вижу загрузку каждой отдельной фотографии в режиме реального времени, а не просто показываю все после загрузки изображений. 31.01.2011
  • Похоже, у Nivo есть встроенный файл loading.gif, который я использую. Я просто установил цвет bg, чтобы он соответствовал окружающему div, чтобы он совпадал, и это, казалось, скрывало загрузку, пока все не было загружено. Однако, к сожалению, я не смог правильно использовать $(window).load() на этом веб-сайте. Firebug выдал ошибку, в которой говорилось, что это недопустимая функция. Не знаю почему так. 04.02.2011
    • Новые материалы
    Я хотел выучить язык программирования MVC4, но не мог выучить его раньше, потому что это выглядит сложно…
    Просто начните и учитесь самостоятельно Я хотел выучить язык программирования MVC4, но не мог выучить его раньше, потому что он кажется мне сложным, и я бросил его. Это в основном инструмент..
    Лицензии с открытым исходным кодом: руководство для разработчиков и создателей
    В динамичном мире разработки программного обеспечения открытый исходный код стал мощной парадигмой, способствующей сотрудничеству, инновациям и прогрессу, движимому сообществом. В основе..
    Объяснение документов 02: BERT
    BERT представил двухступенчатую структуру обучения: предварительное обучение и тонкая настройка. Во время предварительного обучения модель обучается на неразмеченных данных с помощью..
    Как проанализировать работу вашего классификатора?
    Не всегда просто знать, какие показатели использовать С развитием глубокого обучения все больше и больше людей учатся обучать свой первый классификатор. Но как только вы закончите..
    Работа с цепями Маркова, часть 4 (Машинное обучение)
    Нелинейные цепи Маркова с агрегатором и их приложения (arXiv) Автор : Бар Лайт Аннотация: Изучаются свойства подкласса случайных процессов, называемых дискретными нелинейными цепями Маркова..
    Crazy Laravel Livewire упростил мне создание электронной коммерции (панель администратора и API) [Часть 3]
    Как вы сегодня, ребята? В этой части мы создадим CRUD для данных о продукте. Думаю, в этой части я не буду слишком много делиться теорией, но чаще буду делиться своим кодом. Потому что..
    Использование машинного обучения и Python для классификации 1000 сезонов новичков MLB Hitter
    Чему может научиться машина, глядя на сезоны новичков 1000 игроков MLB? Это то, что исследует это приложение. В этом процессе мы будем использовать неконтролируемое обучение, чтобы..
    Для любых предложений по сайту: [email protected]