Как предварительно загрузить следующие изображения в Fancybox 3? - PullRequest
Новая
       58

Как предварительно загрузить следующие изображения в Fancybox 3?

0 голосов
/ 12 июня 2018

Я только начал использовать Fancybox 3.3.5 в своем проекте Ruby on Rails.

В соответствии с документацией, я использую его следующим образом: 

<a href="image.jpg" data-fancybox data-caption="Caption for single image">
    <img src="thumbnail.jpg" alt="" />
</a>

ПРОБЛЕМА : Если исходное изображение очень большое, время загрузки (с видимым счетчиком) может занять несколько секунд.Я хотел бы смягчить это.

МОЯ ИДЕЯ : я думаю, что лучший способ добиться этого - предварительно загрузить (несколько) следующих изображений из галереи, пока пользователь смотрит на одно из них.

ВОПРОС : Есть ли способ предварительно загрузить следующие изображения в Fancybox 3? Я знаю, что Fancybox не делает это из коробки.Но, может быть, у вас была похожая проблема, или вы можете дать некоторые советы о том, как сделать это наиболее эффективным способом?

Я знаю об опции preload, предоставляемой конфигурацией Fancybox.Однако он в основном заменяет спиннер на версию изображения с большим пальцем, одновременно загружая исходное изображение в фоновом режиме.Это не то, что я хочу, в основном потому, что мои пальцы слишком маленькие, чтобы отображать их во весь экран;это просто не выглядит достаточно хорошо.

1 Ответ

0 голосов
/ 12 июня 2018

fancybox автоматически загружает текущие и предыдущие / следующие изображения.

Вы можете добавить атрибуты data-width и data-height, чтобы отобразить уменьшенное изображение, пока реальное изображение все еще загружается и медленно появляется над заполнителем, см. https://fancyapps.com/fancybox/3/docs/#images для получения дополнительной информации.

Вы можете использовать атрибут data-thumb для установки альтернативного миниатюры, см. Пример здесь - https://codepen.io/fancyapps/pen/VyLOJX?editors=1000

Если ваши изображения «очень большие» (как вы сказали), это не будетХорошая идея - попытаться предварительно загрузить слишком много из них, потому что это значительно замедлит все.

...