通過AJAX提供Fancybox

在Fancybox's home page上有一個示例（頁面底部的最後一個），Fancybox通過直接列表進行饋送。通過AJAX提供Fancybox

現在我想建立一個畫廊，您只看到第一個縮略圖，然後你點擊後，一個PHP腳本發送回相同的格式提供的圖像的列表作爲例子顯示：

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

現在我的問題是圖像沒有顯示，因爲Fancybox正在做我的網址列表（即圖像給404的）。

鏈接（當直接打開時）工作正常。
將PHP的直接輸出直接插入到腳本中一切都很好。
什麼的fancybox不被覆蓋我的列表，如：

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

當然，這將失敗。

我的問題是如何通過AJAX正確提供Fancybox（或任何其他燈箱庫）？

來源

2011-02-16 fabrik

沒有必要修改Fancybox的源代碼本身我所需要的就是重新組合通過AJAX爲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 
    }); 
}); 
...

來源

2011-03-16 09:25:19 fabrik

請問您可以看看[this]（http://stackoverflow.com/questions/31351626/jquery-fancybox-with-ajax/31352383）的問題嗎？提前致謝。 – 2015-07-11 13:55:24

我只是搞亂了這一點，發現fancybox只處理一個圖像在一次從ajax，它需要在HTML。那麼，什麼是希望看到的是：

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

另外，我剛纔已經回答this question有關加載了這實際上需要對插件本身的兩個小的變化新的Ajax加載數據的畫廊。

來源

2011-03-05 04:15:21 Mottie

通過AJAX提供Fancybox

回答

相關問題