Запретить Fancybox на отключенных изображениях

Question

Я делаю сайт с сеткой фотографий, которые «фильтруются». Я звоню в fancybox с:

$(".popbox").fancybox();

Когда изображение отфильтровывается, оно получает класс «отключен». Обратите внимание, что страница не перезагружается.

<a class="popbox disabled" style="opacity: 0.3;">
<img alt="placeholder" src="_assets/images/placeholder.jpg">
</a>

Как сделать так, чтобы при нажатии на отключенное изображение fancybox не активировался? Мне также нужно, чтобы он снова работал при смене фильтра и повторном включении изображения.

Answer 1

Вот один из способов сделать это ( demo ):

$(function() {
    $('.popbox').click(function() {
        if (!$(this).is('.disabled')){
            $.fancybox('<img src="' + $(this).attr('href') + '" height="333" width="500">');
        }
        return false;
    });
});

Обновление: А вот, вероятно, лучший способ сделать это, используя обратный вызов onStart ( демо ):

$(function() {
    $('.popbox').fancybox({
        onStart: function(link) {
            if ($(link).is('.disabled')) {
                return false;
            }
        }
    });
});

Answer 2

Хм, попробуй:

$('.popbox:not(.disabled)').fancybox();