Хак для DLE ImgLoads


Вариант установки скрипта постепенной загрузки изображений, можно увидеть при спуски, тут же начинаются открываться файл за файлом. Из рубрики хак для DLE ImgLoads - позволяют сделать загрузку страницы лучше, если она попадет в видимую зону. Какие же плюсы от такой загрузки изображений? Скорость загрузки появления страницы увеличивается, трафик не тратится и т.д. По сути обычный скрипт Lazyload, который не загружает файл, пока не попадет в видимую зону, создает эффект блика картинки при скроле.

Из раздела хаки для DLE ImgLoads сложный и простой вариант, позволяет создать эффект, при котором иллюстрация реально не загружается, пока не попадёт в видимую часть окна. Такой эффект можно наглядно увидеть у Гугла при поиске нужной картинки. На dle9.com представлены демо страницы, выглядит замечательно, хотя картинка выскакивает резко и с каким-то балаканьем - немного неприятно смотреть. Возможно, кто-то доработает, чтобы был более плавный вариант подгрузки, включая прогресс-бар и постепенным появлением изображения.

Картинки также смогут увидеть все те, у кого отключен JS-скрипт и роботы в том числе, хотя они могут и проигнорировать.

Отличный фотохостинг изображений без регистрации


Если ваш веб-сайт связан с большим количеством картинок, вы хотите сэкономить дисковое пространство и не нагружать сервер провайдера, то советую отличный фотохостинг изображений без регистрации для хранения большого объема графической информации обладающий быстрой загрузкой. Фотохостинг изображений imghost.pro замечательно подойдет любым электронным проектам созданных на DataLife Engine.

Итак, приступим к установке данного хака.
Простой вариант установки хак DataLife Engine ImgLoads
Закачайте файл ImgLoads.js в папку js в вашем шаблоне

Перед
</head>


Прописать
<!--jQuery-постепенная-загрузка-изображений-->
<script type="text/javascript" src="/templates/Default/js/ImgLoads.js"></script>
<!--jQuery-постепенная-загрузка-изображений-->


и в шаблонах, там где изображение из поста, дописать к
src data-


чтоб было как ниже на примерах
<img data-src="[xfvalue_poster]">

<img data-src="{image-1}">


Автор Dogmatist
Демо
Внимание! У Вас нет прав для просмотра скрытого текста.


Скачать DLE скрипт ImgLoads с инструкцией

Hak-DLE-imgloads.rar [20,56 Kb] (cкачиваний: 175)
  • 60

Комментарии 1

zasara от 2 июня 2015 19:08
как тогда сделать для полной новости вывод , если не убирать full-story?
ставить img data-src="image-1" , но не править {full-story} на full-story limit=xxxxx
так как надо иметь нормальное описание текста ( не лимитированное) , но и картинки не лезли из краткой и полной вместе ....
Добавить комментарий

Оставить комментарий

    • bowtiesmilelaughingblushsmileyrelaxedsmirk
      heart_eyeskissing_heartkissing_closed_eyesflushedrelievedsatisfiedgrin
      winkstuck_out_tongue_winking_eyestuck_out_tongue_closed_eyesgrinningkissingstuck_out_tonguesleeping
      worriedfrowninganguishedopen_mouthgrimacingconfusedhushed
      expressionlessunamusedsweat_smilesweatdisappointed_relievedwearypensive
      disappointedconfoundedfearfulcold_sweatperseverecrysob
      joyastonishedscreamtired_faceangryragetriumph
      sleepyyummasksunglassesdizzy_faceimpsmiling_imp
      neutral_faceno_mouthinnocent