ошибка при передаче переменной массива в fancybox

Question

На моем сайте есть эта ссылка, называемая изображениями, и я хочу, чтобы, когда пользователь щелкает по ней, она отображала галерею изображений с помощью fancybox. Я использую атрибут name, чтобы поместить все имя файла изображения, а затем использую javascript для его анализа.

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

Вот мой код.

$(".imageGallery").click(function() {
        var pURL = $(this).attr("name");
        var pID  = "#" + $(this).attr("id");
        var imageList="";
        var arrUrl = new Array();
        var i=0;            

        if (pURL.indexOf(',') != -1)
        {
            arrUrl = pURL.split(',');
            imageList = arrUrl;
        }else {imageList = pURL;}
        alert(imageList);
        $.fancybox([imageList], {
            'autoScale'             : true,
            'autoDimensions'        : true,
            'speedIn'               : 800,
            'speedOut'              : 800,
            'changeSpeed'           : 500,
            'padding'               : 0,
            'centerOnScroll'        : false,
            'type'                  : 'image',
            'transitionIn'          : 'fade',
            'transitionOut'         : 'fade',  
            'showCloseButton'       : true,
            'titlePosition'         : 'outside',
            'hideOnContentClick'    : true,
            'overlayColor'             : '#1b2642',
            'showNavArrows'         : true
        });
    });

Answer 1

ImageList - это массив.Вам нужно сделать это (хотя зачем все URL-адреса в атрибуте NAME чего-либо?):

if (pURL.indexOf(',') != -1) {
   imageList = pURL.split(',');
}
else {
  imageList = [pURL];
}
alert(imageList);
$.fancybox(imageList, { // no brackets

Предполагается, что вы пробуете версию manual2 на демонстрационной странице

$("#manual2").click(function() {
    $.fancybox([
        'http://farm5.static.flickr.com/4044/4286199901_33844563eb.jpg',
        'http://farm3.static.flickr.com/2687/4220681515_cc4f42d6b9.jpg',
        {
            'href'  : 'http://farm5.static.flickr.com/4005/4213562882_851e92f326.jpg',
            'title' : 'Lorem ipsum dolor sit amet, consectetur adipiscing elit'
        }
    ], {
        'padding'           : 0,
        'transitionIn'      : 'none',
        'transitionOut'     : 'none',
        'type'              : 'image',
        'changeFade'        : 0
    });
});

---

ОБНОВЛЕНИЕ: чтобы использовать второй формат, вы можете использовать rel и title:

$(".imageGallery").click(function() {
  var pURL = $(this).attr("rel");
  var pTitle = $(this).attr("title");
  var arrUrl = (pURL.indexOf(',') != -1)?pURL.split(','):[pURL];
  var arrTitle = (pTitle.indexOf(',') != -1)?pTitle.split(','):[pTitle];
  var imageList = [];
  for (var i=0;i<arrUrl.length;i++) {
    imageList[i] = { "href":arrUrl[i], "title": arrTitle[i] }
  }
  $.fancybox(imageList, {