2013-11-16 7 views
2

Ok здесь мы идем ...JQuery FancyBox - Несколько галереи - Несколько открытых кнопок

Что я пытаюсь добиться, чтобы иметь несколько галерей на странице, но вместо того, нажав на картинку, чтобы открыть их, Я хочу иметь пользовательскую открытую кнопку.

<a href="#" class="gallerya">Open Gallery 1</a> 
<a href="#" class="galleryb">Open Gallery 2</a> 
<a href="#" class="galleryc">Open Gallery 3</a> 

В каждой галерее должно быть несколько изображений. Это возможно? Если да, то как?

ответ

3

Вы не указали, какую версию Fancybox вы используете. Предполагая, что это version 2, вот что вы ищете: FIDDLE.

В основном, вы сохраняете все изображения галереи в массиве Javascript. Как так:

var images = { 
    'gallerya': [ 
     { 
      href : 'http://fancyapps.com/fancybox/demo/1_b.jpg',     
      title : 'Gallery 1 - 1' 
     }, 
     { 
      href : 'http://fancyapps.com/fancybox/demo/2_b.jpg',     
      title : 'Gallery 1 - 2' 
     }, 
     { 
      href : 'http://fancyapps.com/fancybox/demo/3_b.jpg',     
      title : 'Gallery 1 - 3' 
     } 
    ], 
    'galleryb': [ 
     { 
      href : 'http://fancyapps.com/fancybox/demo/4_b.jpg',     
      title : 'Gallery 2 - 1' 
     }, 
     { 
      href : 'http://fancyapps.com/fancybox/demo/5_b.jpg',     
      title : 'Gallery 2 - 2' 
     } 
    ], 
    ... 
}; 

Затем создается пользовательский обработчик щелчка для вашей галереи замкам и вызовите $.fancybox.open метод с галереей вы хотите. Для получения подробной информации посетите страницу fiddle.

$(".gallery-opener").click(function() { 
    $.fancybox.open(images[$(this).data('gallery-id')], { 
     padding : 0 
    }); 

    return false; 
}); 
Смежные вопросы