Кормление Fancybox через AJAX

Question

На Домашняя страница Fancybox есть пример (последний в нижней части страницы), когда Fancybox передает прямой список.

Теперь я хотел бы создать галерею, в которой вы видите только первый эскиз, а затем после того, как вы щелкнете по нему, скрипт PHP вернет список изображений, доступных в том же формате, что и в примере:

'http://example.com/img1.jpg','http://example.com/img2.jpg'

Теперь моя проблема в том, что изображения не отображаются, потому что Fancybox что-то делает с моим списком URL (то есть изображения с 404).

• Ссылки (при прямом открытии) работают нормально.
• Прямой вывод PHP, вставленный прямо в скрипт, все в порядке.
• Fancybox перезаписывает мой список следующим образом:

http://example.com/'http://example.com/img1.jpg','http://example.com/img2.jpg'

Конечно, это не получится.

У меня вопрос: как правильно кормить Fancybox (или любую другую библиотеку лайтбоксов) через AJAX?

Answer 1

Не было необходимости изменять сам исходный код Fancybox, все, что мне было нужно, чтобы заставить эту вещь работать, - это заново собрать массив для правильной подачи галереи через AJAX.

...
var _items = [];
$.getJSON('ajax/gjson.php', {dir: $(this).attr('rel')}, function(response){

    $.each(response, function(key, val) {
        _items.push({'href' : val.href, 'title' : val.title});
    });

    $.fancybox(_items, {
        'padding'           : 0,
        'transitionIn'      : 'none',
        'transitionOut'     : 'none',
        'type'              : 'image',
        'changeFade'        : 0
    });
});
...

Answer 2

Я просто возился с этим и обнаружил, что fancybox имеет дело только с одним изображением из ajax за раз, и он должен быть в HTML. Итак, что он ожидает увидеть это:

<a href="#" title="image1 title"><img src="image1.jpg"></a>

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