webForumDet fria alternativet

Jquery vill inte dra igång

JavaScript

22 svar · 1 503 visningar · startad av Mika3l · sida 2 av 2

Frågan, av Mika3l

Har gjort mina första försök att fixa ihop något med Jquery som inte är helt färdigt. Det jag vill åstakomma är att visa en preload-bild när ett gäng thumbnails visas, de hämtar jag in antingen från en databas eller XML (tar det senare när själva basfunktionen fungerar). Har hittat en sida som beskriver det jag är ute efter rätt så väl men jag lyc

Läs frågan i sin helhet →
Medlem sedan nov. 20018 492 inlägg
#21

Gick åt skogen, fick inte ens igång funktionen. Nåt som måste läggas till innan loadImages() för att dra igång det? Testade med $(function () { ... } men ingen lycka.
Säkert skitlätt men jag är ute på rätt så okänd mark, har kollat på w3schools med hittade ingen hjälp den här gången. :)

Medlem sedan juni 20019 519 inlägg
#22
var loadImageGallery = function(element, images) {
    $(images).each(function (index, image) {
        // create the LI programatically
        var listItem = $('<li id="photo_' + index + '"></li>').attr('class', 'loading');

        // append the new LI to UL
        $(element).append(listItem);

        // new image
        var img = new Image();

        // load image
        var $img = $(img)
            .wrap("<a/>")
            .css('display', 'none')
            .addClass('thumbnail')
            .attr('src', '@Href("~/Content/Images/Photo/thumb_")' + image.name)
            .load(function () {
                listItem.removeClass('loading').append(this);
                $img
                    .fadeIn()
                    .wrap("<a/>")
                    .parent()
                        .attr("href", '@Href("~/Content/Images/Photo/")' + image.name)
                        .attr("class", 'fancybox')
                        .attr("data-fancybox-group", 'a')
                        .attr("title", image.title);

            }).error(function () {
                listItem.remove();
            });
    });
};

Så har du två inparameter, vilket element du skall appendar till och vilka bilder.

$(function() {
    var images = [
        { name: 'tryck_110316_0120.jpg', title: 'Tryck' },
        { name: 'tryck_110316_0067.jpg', title: 'Tryck' },
        { name: 'tryck_mode_110217_0007.jpg', title: 'Tryck' },
        { name: 'editorial_01.jpg', title: 'Newz' },
        { name: 'editorial_02.jpg', title: 'Newz' },
        { name: 'editorial_03.jpg', title: 'Newz' }
        //{ name: '', title: '' },
    ];
    loadImageGallery('ul#photo', images);
    //loadImageGallery('ul#photo2', images); // Add images to ul#photo2 also....
});

anropar loadImagesGallery med bilder och lägg in den i rätt ul lista.

Medlem sedan nov. 20018 492 inlägg
#23

Tack som fan! :D
Finns bullar och kaffe om du har vägarna förbi Karlstad nån gång! ;)

264 ms totalt · 4 externa anrop · v20260731065814-full.6fe65c25
122 ms — deklarationer (db)
0 ms — hämta statistik (cache)
131 ms — hämta tråd, inlägg och bilagor (db)
130 ms — ändringar (db)