Dynamisches Laden von Ajax-Inhalten auf Fancybox aus der MySQL-Datenbank

Was Sie tun könnten, ist, die kommenden (verwandten) Elemente aus Ihrer Datenbank zu holen und sie in einem json zu speichern Variable wie :

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

Dann push die Elemente aus dieser Variablen in die Galerie innerhalb von beforeLoad Rückruf wie :

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

Hinweis dass wir einen Schalter verwenden (die done Variable) zum Pushen die Gegenstände nur einmal (möglicherweise müssen wir den Schalter zurücksetzen nach dem Schließen von fancybox)

JSFIDDLE

HINWEIS :Die Elemente werden erst hinzugefügt (gepusht), nachdem wir das letzte Element im DOM (in Ihrem Fall das 4.) gesehen haben. Wenn Sie also anfangen, die Galerie rückwärts zu durchsuchen, werden Sie die neuen Elemente erst in der zweiten Schleife sehen.

Vielleicht möchten Sie loop setzen auf false obwohl