prowebber.ru - Тут есть все для настоящих вебмастеров

Чтение RSS Мы в твиттере
«    Декабрь 2016    »
ПнВтСрЧтПтСбВс
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
 

Всё для вебмастера » Всё для DataLife Engine » Постепенная загрузка изображений

Постепенная загрузка изображений


Данный материал предоставлен сайтом ProWebber.ru исключительно в ознакомительных целях. Администрация не несет ответственности за его содержимое.
У нас вы можете скачать бесплатно Постепенная загрузка изображений.


Cкрипт постепенной загрузки изображений
Постепенная загрузка изображений

Как оно работает
Изображение загружается только тогда когда попадает в видимую зону
Примеры
http://dogmatist.nbr.by/lastnews/page/2/
или очень хорошо видно в итогах поиска...
А так же можно посмотреть тут http://jsfiddle.net/D0Gmatist/Z5mFq/2/
Скачайте файл Z imgloads.rar Размер: 1.6 Kb, скачали 390 раз и из него залейте файл ImgLoads.js в папку js в вашем шаблоне

Перед
</head>


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


и в шаблонах, там где изображение из поста, дописать к src data-
чтоб было как ниже на примерах
<img data-src="[xfvalue_poster]">

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


http://dogmatist.nbr.by/?do=search=Джеки Чан

http://dogmatist.nbr.by/?do=search=2012

http://dogmatist.nbr.by/?do=search=Комедия


+26
Просмотры: 8506 VIP ProWebber | Комментарии (46)
Теги: js, dle
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.

#1wmid32

  • 2 февраля 2013 13:08
  • Регистрация: 5.08.2011
  • ICQ: --
  • Комментариев: 143
Точно пашет? а то я ставил подобное и нифига! Все картинки не загружало вообще

--------------------

0

#2D0Gmatist

  • 2 февраля 2013 13:11
  • Регистрация: 28.07.2012
  • ICQ: --
  • Комментариев: 297
  • Выкл.
Я же скинул ссылок гору с рабочими примерами

--------------------

+3

#3vpkach

  • 2 февраля 2013 13:48
  • Регистрация: 18.07.2012
  • ICQ: --
  • Комментариев: 118
ооо спасибо я видал у тебя классно

0

#4serforall

  • 2 февраля 2013 13:49
  • Регистрация: 6.12.2011
  • ICQ: --
  • Комментариев: 205
  • Выкл.
Что за шаблон на сайте???

--------------------

0

#5masya1981

  • 2 февраля 2013 13:50
  • Регистрация: 4.10.2010
  • ICQ: --
  • Комментариев: 52
Подскажите какие + от такой загрузки изображений?

0

#6D0Gmatist

  • 2 февраля 2013 14:08
  • Регистрация: 28.07.2012
  • ICQ: --
  • Комментариев: 297
  • Выкл.
Цитата: serforall
Что за шаблон на сайте???
Моя работа

Цитата: masya1981
Подскажите какие + от такой загрузки изображений?
Ну прикинь сам... трафик не тратится ... и загрузка страницы быстрее ...

--------------------

+2

#7scome

  • 2 февраля 2013 14:24
  • Регистрация: 26.08.2012
  • ICQ: 916373
  • Комментариев: 23
D0Gmatist, megogo.net шаблон. Осталось слайдер добавить и все будет идентично.

--------------------

0

#8JIexaman

  • 2 февраля 2013 15:02
  • Регистрация: 26.02.2010
  • ICQ: --
  • Комментариев: 34
"sss" в футере сайта убило =)
А так, модуль интересный, возьмём )

0

#9Min-Z-Drav

  • 2 февраля 2013 15:17
  • Регистрация: 14.09.2010
  • ICQ: 60135505
  • Комментариев: 50
  • Выкл.
Прекрасно работает спасибо!

--------------------

+3

#10Andrey™

  • 2 февраля 2013 15:44
  • Регистрация: 28.09.2010
  • ICQ: --
  • Комментариев: 153
  • Выкл.
Цитата: Min-Z-Drav
А так, модуль интересный, возьмём )
Это js скрипт.

+2

#11vpkach

  • 2 февраля 2013 17:06
  • Регистрация: 18.07.2012
  • ICQ: --
  • Комментариев: 118
Всё работает без проблем вообще !

+1

#12hatchees

  • 2 февраля 2013 17:36
  • Регистрация: 4.12.2010
  • ICQ: 638435976
  • Комментариев: 161
  • Выкл.
Так это обычный скрипт Lazyload + он не загружает картинки по видимости, при скроле он просто создает эффект блика для картинки... нупы :)

-6

#13iwanowi4

  • 2 февраля 2013 19:16
  • Регистрация: 28.09.2010
  • ICQ: --
  • Комментариев: 119
  • Выкл.
http://www.appelsiini.net/projects/lazyload
Тут найдёте полное описание всех возможных функций для подобного скрипта, и демо как они работают...
Цитата: hatchees
эффект блика для картинки... нупы :)

http://www.appelsiini.net/projects/lazyload/enabled.html - насчёт "нупов", не стоит так горячиться... dash
картинка реально не загружается, пока не попадёт в видимую часть окна.

+3

#14Aslan

  • 2 февраля 2013 20:46
  • Регистрация: 6.12.2010
  • ICQ: --
  • Комментариев: 170
На демо выглядит неплохо, но упомянутые блики - не есть хорошо.
Картинки выскакивают резко и с каким-то блыманьем - глазам неприятно смотреть на сайт с таким эффектом.
Может, кто-то доработает и сделает более плавный вариант подгрузки картинок, включая прогресс-бар и постепенное появление изображение? Например, неплохо реализовано на ру-сайте бонприкса:
http://www.bonprix.ru/kategoriya/zhienskaia-moda-zhienskaia-moda-topy/?pgs=96

0

#15D0Gmatist

  • 3 февраля 2013 00:41
  • Регистрация: 28.07.2012
  • ICQ: --
  • Комментариев: 297
  • Выкл.
Цитата: hatchees
Так это обычный скрипт Lazyload + он не загружает картинки по видимости, при скроле он просто создает эффект блика для картинки... нупы :)
Я от каждого твоего ответа каждяй раз болдю ...
Цитата: iwanowi4
картинка реально не загружается, пока не попадёт в видимую часть окна.
Спасибо ....
Цитата: Aslan
На демо выглядит неплохо, но упомянутые блики - не есть хорошо.
Картинки выскакивают резко и с каким-то блыманьем - глазам неприятно смотреть на сайт с таким эффектом.
Может, кто-то доработает и сделает более плавный вариант подгрузки картинок, включая прогресс-бар и постепенное появление изображение? Например, неплохо реализовано на ру-сайте бонприкса:
Да... тут я согласен есть нюанс .. если будет время .. то и сам поправлю...


Цитата: JIexaman
"sss" в футере сайта убило =)
А так, модуль интересный, возьмём )

Блиииин ))) шаблон не дописан не надо цепляться

hatchees,
Я вот сколько вижу ... каждяй раз ты себя выставляешь бубном ... НЕНАДОЕЛО???

если ты хочешь убедиться в работе скрипта то вот тебе БАРАНУ
http://screen.ticno.com/upload/t/Y/tY2HBDsuLGmAzLFMKaUw.png
Вот тебе изображение скрин без промотки
А вот тебе с промотки НЕБОЛЬШОЙ
http://screen.ticno.com/upload/V/L/VLPHQXEFjQiCqUe9sr8q.png
И вот тебе с полной загрузкой
http://screen.ticno.com/upload/8/y/8ydR46HP6h6LvAd89jWK.png

--------------------

+1

#16D0Gmatist

  • 3 февраля 2013 01:20
  • Регистрация: 28.07.2012
  • ICQ: --
  • Комментариев: 297
  • Выкл.
сори за лексикон .. я пью

--------------------

+2

#17D0Gmatist

  • 3 февраля 2013 01:47
  • Регистрация: 28.07.2012
  • ICQ: --
  • Комментариев: 297
  • Выкл.
Цитата: scome
D0Gmatist, megogo.net шаблон. Осталось слайдер добавить и все будет идентично.
Ну я не спорю об сходстве .. но об функционале то гогоша ЛОХ...
по сравнению с тем что у меня ....... прошу eчесть что я пишу сайт ОДИН и + он не дописан (не доработан)

--------------------

+1

#18kinoline

  • 3 февраля 2013 02:06
  • Регистрация: 2.02.2013
  • ICQ: --
  • Комментариев: 1
Aslan,
на сайте бонприкса как раз таки фейк с эмитацией загрузки картинок. Проверяется довольно таки легко - отключай ява скрипт и смотри, что все картинки загружены уже. А на сайте D0Gmatist-а, если отключить, то ни одной картинки загружено не будет.

D0Gmatist, нет желания на продажу замутить такой шаб? Я бы купил

0

#19D0Gmatist

  • 3 февраля 2013 02:24
  • Регистрация: 28.07.2012
  • ICQ: --
  • Комментариев: 297
  • Выкл.
kinoline,
я его как доведу до ума то буду вставлять на продажу ... с модулем для полей которые на сайте Вы видите в меню (год, страна, жанр)

К стати встроил модул .. - скрипт отдельной жалобы на видио
http://dogmatist.nbr.by/films/2388-nikogda-ne-sdavaysya-never-back-down.html
Нажмите и увидите жалобу .. если кого то заинтересует то могу выложить
http://screen.ticno.com/index.php?image=jKiTaJQWSCvirPVrfrcw.png




--------------------

+1

#20iwanowi4

  • 3 февраля 2013 04:54
  • Регистрация: 28.09.2010
  • ICQ: --
  • Комментариев: 119
  • Выкл.
Цитата: kinoline
... фейк с эмитацией загрузки картинок. Проверяется довольно таки легко - отключай ява скрипт и смотри...
Ребятки, ну прежде чем заявлять что то, посмотрите что и как работает, почитайте описание функций работы этих скриптов...
Не знаю как у них конкретно устроено (похоже на замес ajax и javascript).
Но вот тут http://www.bonprix.ru/js-lib/libs/requirejs/2.1.0/require.min.js
в коде отчётливо виден jQuery plugin for lazy loading images, а к примеру, в подобной конструкции:
<img class="lazy" src="img/grey.gif" data-original="img/example.jpg"  width="640" heigh="480">
<noscript><img src="img/example.jpg" width="640" heigh="480"></noscript>
картинки также смогут увидеть все те, у кого отключен javascript и роботы в том числе, хотя они могут и проигнорировать, чего у них на уме... mail

0
1 2 3
Предыдущая    Следующая
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии в данной новости.

Max-energy.top - Заработок на электросчетчиках;)

Skripters.info - все для вебмастера. Только эксклюзивный контент.

Создание шаблонов DLE, быстро и недорого! 3wave.com.ua

Бро лей на лучшую партнёрку

Почти бесплатный VDS хостинг!

Поддержи сайт
Скрипты, cms, шаблоны, статьи по раскрутке

Опросы

Как часто вы бываете на сайте?

Захожу 1-2 раза в день
1-2 часа в сутки
Более 2 часов
Почти целый день тут smile

Архив новостей
Ноябрь 2016 (7)
Октябрь 2016 (10)
Сентябрь 2016 (8)
Август 2016 (11)
Июль 2016 (14)
Июнь 2016 (17)

Последние комментарии:

Искать людей

Ваши переписки