MySQL डेटाबेस से फैंक्सबॉक्स पर अजाक्स सामग्री को गतिशील रूप से लोड करें

आप अपने डेटाबेस से आने वाली (संबंधित) वस्तुओं को प्राप्त करने और उन्हें json में संग्रहीत करने के लिए क्या कर सकते हैं चर जैसे :

var databaseResponse = [{
    href: "path/image05.jpg", // 4 are visible on page so
    type: "image",
    title: "Image #5",
    isDom: false
}, {
    href: "path/image06.jpg",
    type: "image",
    title: "Image #6",
    isDom: false
}, {
    href: "path/image07.jpg",
    type: "image",
    title: "Image #7",
    isDom: false
}]; // etc

फिर push beforeLoad . के भीतर उस वेरिएबल से गैलरी में आइटम कॉलबैक जैसे:

var done = false; // initialize switch
jQuery(document).ready(function ($) {
    $(".fancybox").fancybox({
        // loop : false, // optional
        beforeLoad: function () {
            // here get next items from database 
            // and store them in a json variable
            // e.g. "databaseResponse"
            if ((this.index == this.group.length - 1) && !done) {
                for (var i = 0; i < databaseResponse.length; i++) {
                    this.group.push(databaseResponse[i]);
                };
                done = true; // push items only once
            }
        },
        afterClose: function () {
            done = false; // reset switch
        }
    });
}); // ready

सूचना कि हम एक स्विच . का उपयोग कर रहे हैं (done वेरिएबल) से पुश . करने के लिए आइटम केवल एक बार (हमें स्विच को रीसेट करने की आवश्यकता हो सकती है) हालांकि फैंक्सबॉक्स बंद करने के बाद)

JSFIDDLE

नोट :आइटम केवल तभी जोड़े (धक्का) दिए जाएंगे जब हम DOM (आपके मामले में चौथा) में अंतिम आइटम देख रहे हैं, इसलिए यदि आप गैलरी को पीछे की ओर ब्राउज़ करना शुरू करते हैं, तो आपको नए आइटम नहीं दिखाई देंगे, लेकिन दूसरे लूप तक।

आप loop सेट करना चाह सकते हैं करने के लिए false हालांकि