Задать вопрос
Cheizer
@Cheizer

Как по событию click запустить lightbox функцию?

Хочу по клику на элемент запускать библиотеку ilightbox, чтобы открыть изображение с её помощью.
Вот как делаю:

$(document).ready(function(){
		
  $(".ilightbox").click(function() {
    //тут я еще хочу кое что сделать

        $(this).iLightBox({
           skin: 'metro-white',
           maxScale: 2,
        });
     });

});

<a href="/big-images.jpg" class="ilightbox">
 <img src="/images.jpg" alt="">
</a>
<a href="/big-images.jpg" class="ilightbox">
 <img src="/images.jpg" alt="">
</a>

Пробовал bind click, тоже не работает, THIS работает если обернуть в each функцией, но each это не click.

Как по click функции с this вместо селектора, запускать библиотеки типа lightbox?
Даже поднял на codepen https://codepen.io/Cheizer/pen/dJVpJr
  • Вопрос задан
  • 235 просмотров
Подписаться 1 Простой Комментировать
Решения вопроса 1
Дело в том что при клике на ссылку срабатывает стандартное поведение - собственно клик по ссылке. Чтобы избежать его и заставить навешивать свое - нужно предотвратить стандартное поведение, например использовать e.preventDefault();

$(".ilightbox").click(function(e) {
      e.preventDefault();
            
      // будет работать!
    });


Рабочий пример https://codepen.io/gdemad/pen/EowmaG

PS: Но нужно иметь ввиду что при каждом клике на элемент каждый раз будет навешиваться функционал iLightBox на один и тот же элемент, а это не очень правильно. Тут уже с архитектурным решением что-то нужно думать/менять.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
ms-dred
@ms-dred
Вечно что то не то и что то не так...
Я обычно не парюсь, тупо по необходимости создаю элемент script и подгружаю библиотеку. К примеру с plupload, он по сути нужен только тогда когда кто то хочет загрузить файл, ну вот и подключаю скрипт тогда когда это необходимо.

Решение напрашивается само, кликнул -> создал script с нужным src и выставил его перед /body, вот собственно и все и никаких релоадов и прочего не нужно
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы