Fancybox только стреляет по первой галерее

Question

Я использую цикл foreach внутри wordpress, чтобы присвоить тегу каждого изображения значение $post_ID. Я также создаю переменную данных с именем 'gallery' со значением $post_ID. Затем я использую fancybox для вызова моей переменной данных и запуска fancybox.

Все это прекрасно работает для первой галереи изображений, но когда я перехожу к следующей, она не запускает fancybox, даже если значения данных и значения тега rel совпадают в следующих галереях.

Мой JQuery:

var galleryvalue = $('.portfolio-gallery').data('gallery');

$("a[rel=" + galleryvalue + "]").fancybox({
    'transitionIn'      : 'elastic',
    'transitionOut'     : 'elastic',
    'cyclic'        : true,
    'autoScale'     : true,
    'showNavArrows'     : true,
    'overlayColor'      : '#666'

    }); 

Мой HTML:

<?php $args = array(
    'post_type' => 'attachment',
    'post_mime_type' => 'image',
    'numberposts' => -1,
    'post_parent' => $post->ID,
    'exclude' => get_post_thumbnail_id(),
); ?>

<?php $images = get_posts( $args );
$imageclass = array( 'class' => "gallery-image");

if (!empty($images)) { 
    foreach($images as $image): ?>
        <a rel="<?php echo $post->ID ?>" class="portfolio-gallery" data-gallery="<?php echo $post->ID ?>" href="<?php echo wp_get_attachment_url( $image->ID, 'large' ); ?> " title="" >
            <?php echo wp_get_attachment_image($image->ID, 'singles_thumb', '' ,$imageclass); ?>
        </a>
    <?php endforeach; ?>
 <?php } ?>

Есть идеи, почему fancybox работает только над первой галереей? Fancybox в моем jQuery должен искать разные теги rel для запуска каждой галереи, так что я знаю, что я удваиваюсь на этом.

Answer 1

даже если это не совсем так и отвечу - я не могу добавить комментарий: ваша цель - иметь НЕСКОЛЬКО галерей на одной странице?

Кстати - ваши изображения будут иметь одинаковое значение - это то, чтоты хочешь ?..

Может быть полезно вызвать fancybox прямо на изображениях - так я обычно делаю это для wordpress:

    //***  START FancyBOX   -->
    jQuery(document).ready(function() {
    /* Apply fancybox to multiple items */
    jQuery('.gallery-icon a,.wp-caption a,.wp-caption-text').attr('rel', 'fancygallery')
     //* use the following add class dynamically with jQuery
    //** jQuery('.gallery-icon a').addClass('fancybox').attr('rel','gallery')  
    jQuery(".gallery-icon a").fancybox({
        'my_options_here'   :   'elastic',

    });
    jQuery(".wp-caption a").fancybox({
        'my_options_here'   :   'elastic',

    });
});

Answer 2

Нашел решение моей проблемы.Проблема заключалась в том, что fancybox использовал для запуска.

Переход на запуск fancybox с классом вместо использования тега был хитростью.

$('a.portfolio-gallery').fancybox({
    'transitionIn'      : 'elastic',
    'transitionOut'     : 'elastic',
    'cyclic'        : true,
    'autoScale'     : true,
    'showNavArrows'     : true,
    'overlayColor'      : '#666'            
}); 

И, сделав для моего тега другое значение с использованием идентификатора post->, fancybox увидит, что мой класс портфолио-галереи нажат.И затем распознает, что каждый тег - это отдельная галерея.

<a rel="<?php echo $post->ID ?>" class="portfolio-gallery" data-gallery="<?php echo $post->ID ?>" href="<?php echo wp_get_attachment_url( $image->ID, 'large' ); ?> " title="" >
    <?php echo wp_get_attachment_image($image->ID, 'singles_thumb', '' ,$imageclass); ?>
</a>

Я нашел в информации на странице fancybox http://fancybox.net/howto.Так что мой ответ был довольно прост ... Я просто подумал над этим.