Перейти к публикации

Как заменить img src на img data-src в полной новости


Рекомендованные сообщения

Всем привет. Решил прикрутить к сайту скрипт https://github.com/verlok/lazyload (постепенная загрузка изображений). Никак не могу внедрить замену img src на img data-src необходимую для работы скрипта.

 

Копаюсь в parse.class.php, заменяю все src и ничего. Картинка тупо пропадает при сохранении статьи. Может кто поможет как исправить или показать как нужно сделать?

 

Версия скрипта 13.1

Ссылка на сообщение
Поделиться на других сайтах
22 минуты назад, krockki сказал:

Всем привет. Решил прикрутить к сайту скрипт https://github.com/verlok/lazyload (постепенная загрузка изображений). Никак не могу внедрить замену img src на img data-src необходимую для работы скрипта.

 

Копаюсь в parse.class.php, заменяю все src и ничего. Картинка тупо пропадает при сохранении статьи. Может кто поможет как исправить или показать как нужно сделать?

 

Версия скрипта 13.1

Перестроение публикаций сделать нужно

Ссылка на сообщение
Поделиться на других сайтах
21 минуту назад, krockki сказал:

Всем привет. Решил прикрутить к сайту скрипт https://github.com/verlok/lazyload (постепенная загрузка изображений). Никак не могу внедрить замену img src на img data-src необходимую для работы скрипта.

 

Копаюсь в parse.class.php, заменяю все src и ничего. Картинка тупо пропадает при сохранении статьи. Может кто поможет как исправить или показать как нужно сделать?

 

Версия скрипта 13.1

Цитата

 

Внимание !!!

На данном форуме существуют достаточно жесткие правила, поэтому прежде чем создавать свою тему убедитесь, что вы внимательно их прочитали и поняли.

 

1. Если ваша тема начинается с вопроса и вам нужна какая либо помощь, то в самой теме в обязательном порядке вы должны указывать ссылку на ваш сайт. Если ваш сайт находится в локальной сети и вы не можете предоставить ссылку, или вы не хотите публиковать открытой ссылки на ваш сайт, то отправляйте персональное сообщение с вопросом в службу поддержки непосредственно с сайта http://dle-news.ru/, вам ответят на ваш вопрос в персональном порядке, в случае если пользуетесь платной версией скрипта и обладаете лицензией на скрипт. Если вы пользуетесь демоверсией, то вам необходимо разместить сайт в сети интернет, и только потом обращаться за помощью. По находящимся на локальных компьютерах демоверсиям никакой помощи и поддержки на форуме не оказывается. Если вы не указали сайт, то ваша тема будет закрыта, а аккаунт на форуме заблокирован.

 

2. На данном форуме строго запрещено предлагать или навязывать свои платные услуги. За любое сообщение типа "Помогу дешево, ICQ ..." участник блокируется на форуме без предупреждения.

 

3. Обязательно прочитайте разъясняющую тему http://forum.dle-news.ru/announcement/1-определение-понятия-нелегальной-копии-скрипта-и-понятия-nulled/

А так смотри в сторону jquery

для примера

$("#img").attr("class","card card-header");

во всех img добавляет класс

Ссылка на сообщение
Поделиться на других сайтах
10 минут назад, Gameer сказал:

Перестроение публикаций сделать нужно

Необходимый класс class="lazy" я добавил, очистил кеш и перестроение сделал, все появилось. Но сама проблема в замене src на data-src. Меняю в файле и скрипт режет вывод картинки, остается только надпись TBegin....

 

8 минут назад, alukardua сказал:

А так смотри в сторону jquery

для примера


$("#img").attr("class","card card-header");

во всех img добавляет класс

Я тестирую на локалке, но в качестве лицензионного сайта могу указать https://ochistkadetaley.ru/

Опять же повторюсь с добавлением класса проблем нет, все прописывается и выводится. Проблема с заменой src на data-src. Если меняю на data-src, картинки ломаются.

Ссылка на сообщение
Поделиться на других сайтах
2 часа назад, krockki сказал:

Опять же повторюсь с добавлением класса проблем нет, все прописывается и выводится. Проблема с заменой src на data-src. Если меняю на data-src, картинки ломаются.

Пример "data-src" на теге без изображения, где изображение еще не загружено - это всего лишь фрагмент метаданных в теге div:

<div id="myDiv" data-src="http://mydomain.com/foo.jpg">

<script>
    // in all browsers
    var imageUrl = document.getElementById("myDiv").getAttribute("data-src");

    // or in modern browsers
    var imageUrl = document.getElementById("myDiv").dataset.src;
</script>

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

<img id="myImage" src="http://mydomain.com/foo.jpg" data-src="http://mydomain.com/foo.jpg">

<script>
    var item = document.getElementById("myImage");
    // switch the image to the URL specified in data-src
    item.src = item.dataset.src;
</script>

 

Ссылка на сообщение
Поделиться на других сайтах
20 часов назад, alukardua сказал:

Пример "data-src" на теге без изображения, где изображение еще не загружено - это всего лишь фрагмент метаданных в теге div:


<div id="myDiv" data-src="http://mydomain.com/foo.jpg">

<script>
    // in all browsers
    var imageUrl = document.getElementById("myDiv").getAttribute("data-src");

    // or in modern browsers
    var imageUrl = document.getElementById("myDiv").dataset.src;
</script>

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


<img id="myImage" src="http://mydomain.com/foo.jpg" data-src="http://mydomain.com/foo.jpg">

<script>
    var item = document.getElementById("myImage");
    // switch the image to the URL specified in data-src
    item.src = item.dataset.src;
</script>

 

Можно поконкретнее, я так и не понял. В данный момент изображение выводится вот так:

 

<img class="lazy loading" src="/uploads/posts/2018-11/thumbs/1542564757_86.jpg" style="max-width:100%;" alt="" data-was-processed="true">

Что мне нужно добавить в js чтобы вместо src стало data-src?

 

Ссылка на сообщение
Поделиться на других сайтах
3 минуты назад, krockki сказал:

Что мне нужно добавить в js чтобы вместо src стало data-src?

да в footer пишеш

<script>
    // in all browsers
    var imageUrl = document.getElementById("imgDataSrc").getAttribute("data-src");

    // or in modern browsers
    var imageUrl = document.getElementById("imgDataSrc").dataset.src;
</script>

а картинки

<img id="imgDataSrc" class="lazy loading" data-src="/uploads/posts/2018-11/thumbs/1542564757_86.jpg" style="max-width:100%;" alt="" data-was-processed="true">

и по идее должно заработать

и главное jquery должен быть подключен

Ссылка на сообщение
Поделиться на других сайтах
В 18.11.2018 в 21:48, krockki сказал:

Всем привет. Решил прикрутить к сайту скрипт https://github.com/verlok/lazyload (постепенная загрузка изображений). Никак не могу внедрить замену img src на img data-src необходимую для работы скрипта.

 

Копаюсь в parse.class.php, заменяю все src и ничего. Картинка тупо пропадает при сохранении статьи. Может кто поможет как исправить или показать как нужно сделать?

 

Версия скрипта 13.1

 

Ссылка на сообщение
Поделиться на других сайтах
В 18.11.2018 в 21:48, krockki сказал:

Всем привет. Решил прикрутить к сайту скрипт https://github.com/verlok/lazyload (постепенная загрузка изображений). Никак не могу внедрить замену img src на img data-src необходимую для работы скрипта.

 

Копаюсь в parse.class.php, заменяю все src и ничего. Картинка тупо пропадает при сохранении статьи. Может кто поможет как исправить или показать как нужно сделать?

 

Версия скрипта 13.1

Получше разобрался с этим скриптом

картинки делаеш

<img class="lazy" alt="..." data-src="../img/44721746JJ_15_a.jpg">

в футер пишеш

<script>
  var myLazyLoad = new LazyLoad({
    elements_selector: ".lazy",
    load_delay: 300 //время задержки загрузки
});
  </script>

и все заработает

Ссылка на сообщение
Поделиться на других сайтах

Присоединяйтесь к обсуждению

Вы можете опубликовать сообщение сейчас, а зарегистрироваться позже. Если у вас есть аккаунт, войдите в него для написания от своего имени.

Гость
Ответить в тему...

×   Вставлено в виде отформатированного текста.   Вставить в виде обычного текста

  Разрешено не более 75 эмодзи.

×   Ваша ссылка была автоматически встроена.   Отобразить как ссылку

×   Ваш предыдущий контент был восстановлен.   Очистить редактор

×   Вы не можете вставить изображения напрямую. Загрузите или вставьте изображения по ссылке.

×
×
  • Создать...