Скрипт просмотра изображение на Lightbox
11.01.2024 в 22:34
Данный скрипт предназначен для просмотра картинок или изображений на сайте в окне ulightbox, где присутствуют кнопки переключения по правую и левую сторону. Если ваш сайт на тематику, где основном присутствует изображение, это аватары или обои, то ulightbox будет отличным помощником при осмотре. Ведь вам больше не нужно открывать и закрывать изображение. Теперь для этого присутствует скрипт, который выодит кнопки с полным функционалом про мотки по обе стороны. Если ссылка на изображение идет без перехода, а просто для вывода изображений, то этот скрипт как раз для таких ссылок.

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

Установка:

В админ панели находим Страницы материала и комментариев вашего модуля, где открываем и нужно найти закрывающий тег /body, где перед ним устанавливаем скрипт, что ниже представлен.

Код
<script type="text/javascript">
$('.eMessage img,.eText img') each(function() {
$(this).wrap("<a href='" + this.src + "'/>");
$('a[href$=".jpg"], a[href$=".jpeg"], a[href$=".gif"], a[href$=".png"]').addClass('ulightbox').attr("data-fancybox-group", "ultbx");
});
  </script>


Этот скрипт будет работать на таких модулях:

- Блог
- Новости
- Каталог файлов
- Каталог статей
- Каталог сайтов
- Доска объявлений
- Онлайн игры

Остается форум, для него предназначен другой скрипт.

Данный скрипт ulightbox идет для модуля Форум

Код
<script type="text/javascript">
$(".ucoz-forum-post img").each(function() {
$(this).wrap("<a href='" + this.src + "'/>");
$('a[href$=".jpg"], a[href$=".jpeg"], a[href$=".gif"], a[href$=".png"]').addClass('ulightbox').attr("data-fancybox-group", "ultbx");
});
  </script>


Установка аналогичной первой, разве только в Общий вид страниц форума нужно его прописать.

Важно: здесь нужно понимать, что все идет на стандартные шаблоны, если у вас оригинальный шаблон, то возможно классы кардинально могут отличатся, мы говорим про закручивающий блок с описанием материала тега MESSAGE, что нужно проверять, это какой у вас класс, и уже его прописываем.
Вам понравился материал?
Источник
Обсуждение
Станьте первым, кто оставит свой отзыв или мнение об этом материале
ComForm li{list-style-type:none;margin:0px;padding:0px;}
avatar
© 2024 «zucoz.ru» - Про uCoz, все для Web-мастера в системе uCoz