PHP Dynamic Colorbox с несколькими галереями

У меня есть динамическая галерея, сгенерированная из php-кода, которая представлена ​​только одним изображением. Когда вы выберете это изображение, оно должно открыть цветовую рамку с несколькими фотографиями.

Проблема в том, что мой colorbox не распознает мой rel.

<script>
        $(document).ready(function(){
            //Examples of how to assign the ColorBox event to elements

            $("a.gallery").click(function(){
                var galleryRelative = $(this).attr("rel");
                alert(galleryRelative);

                $(this).colorbox({rel:galleryRelative});

            });
        });
    </script>

И мой HTML

foreach($kittens as $key => $kitten){                 

    echo '<div class="block1 smallblock">';

    echo '<a class="gallery" rel="gallery0" title="blablabla" href="../img/block-03.jpg"> 
             <img src="../img/block-03.jpg" width="299" height="233" alt="kitten" />
          </a>';

    echo '<p><a href="../img/block-03.jpg" rel="gallery0" title="blabla"></a></p>';
    echo '<p><a href="../img/block-02.jpg" rel="gallery0" title="blabla"></a></p>';

    echo '</div>';
}

Я сгенерирую галерею 0 без проблем (я успешно читаю атрибут rel из моей галереи a.gallery в своем скрипте, но colorbox не соответствует ему.


person Marc    schedule 26.06.2012    source источник


Ответы (2)


Colorbox будет использовать ваш атрибут rel по умолчанию. Просто используйте:

$("a.gallery").colorbox();

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

person Jack    schedule 26.06.2012

Вы можете лучше попробовать плагин Pretty Photo для отображения нескольких фотографий в световом окне, щелкнув одно изображение. Я использовал галерею Pikachoose, когда я нажимаю на изображение из PikaChoose, я показываю список изображений внутри светового короба с помощью плагина Pretty Photo демо для Pretty. Надеюсь, это может быть полезно для вас

person muthu    schedule 26.06.2012