Witam serdecznie. To mój pierwszy post na tym forum. Stworzyłem prostą galerię z wykorzystaniem jQuery. Skrypt generuje daną ilość miniatur w zależności od ilości oryginalnych zdjęć. Wykorzystana jest do tego pętla for.. Dodatkowo miniatury oczywiście są skalowane aby proprocje wys-szer były zachowane. Wykorzystuje do tego prosty wzór matematyczny :

szer miniatury = szerokość oryginału / ( wysokość oryginału / wysokość miniatury )

Wysokość miniatury jest stała. Gdy odpalam skrypt z dysku nie ma żadnych problemów. Pojawiają się wyskalowane miniatury. Każda odpowiedniej szerokości wynikającej ze wzoru. Wszystko działa bez żadnego problemu. Lecz gdy wgram skrypt na serwer ku menu zdziwieniu po wygenerowaniu grafik niektóre są za szerokie. Za każdym odpaleniem jest/są to inne grafiki. Raz np. 3 jest za szeroka, raz 4 i 5.. Nie ma na to reguły.. Wystarczy ze odswieze stronę i problem ten znika. Wszystkie pojawiają się w odpowiednich rozmiarach. I gdy znów wylacze przegladarke (skaduje historie przeglądania) i odpale skrypt któraś z grafik lub kilka będzie zbyt szeroka, i tak jak wcześniej przycisk odswiez - problem znika.. Kolejna ciekawostka : dodalem kilka alertow które wyswietlaly wartości wszystkich zmiennych odpowiadających za skalowanie miniatur : wszystko było dobrze - wartości zmiennych zgadzały się a miniatury były dobrej wielkości... Dodam iż po wpisaniu wartości szerokości na sztywno np. 100px problemu także nie ma...

Podaje listing skryptu. Ja dopiero raczkuje w js i jquery. Od kilku dni się tym zajmuję.

Kod
function galeria(wys_f,wys_s,full_Out,full_In,fade_To,opacity,opacity2,opis_div,full_div,menu
_div) {
        var index = 0;
        var stan = 0;
        var szer_full;
        var wys_full;
        var szer_small;
        var w_img_f;
        var s_img_f;
        var s_img;
        var ratio;
        var ratio_f;
        var ilosc = $(full_div+' img').length;
        function show_full() {
                w_img_f = $(full_div+' img').eq(index).height();
                s_img_f = $(full_div+' img').eq(index).width();
                ratio_f = s_img_f / w_img_f;
                s_img = wys_f * ratio_f;
                $(full_div+' img').eq(index).attr("width", s_img);
                $(full_div+' img').eq(index).attr("height", wys_f);
                $(full_div+' img').fadeOut(full_Out);
                $(full_div+' img').eq(index).fadeIn(full_In);
        };            
        function generic() {
            for ( var x=0;x<=(ilosc-1);x++ ) {
                var new_src = $(full_div+' img').eq(x).attr("src");
                szer_full = $(full_div+' img').eq(x).width();
                wys_full = $(full_div+' img').eq(x).height();
                ratio = szer_full / wys_full;
                szer_small = wys_s * ratio;
                var new_img = new Image(szer_small,wys_s);
                new_img.src = new_src;
                var new_link = $("<a></a>");
                new_link.attr("href", "#");
                $(menu_div).append(new_link);
                new_link.append(new_img);
                new_link.fadeTo(0, opacity);
                $(menu_div+' a').eq(index).fadeTo(0, 1);            
                new_link.click(function() {
                index = $(menu_div+' a').index(this);
                if ( stan != index ) {
                    $(menu_div+' a').not(this).fadeTo(fade_To, opacity);
                    $(menu_div+' a').eq(index).fadeTo(0, 1);
                    show_full();
                    show_title();
                    stan = index;
                    return false;
                };});            
                new_link.hover(function() { if ( $(menu_div+' a').index(this) == stan ) { return false; } else { $(this).fadeTo(fade_To, opacity2); };},function() { if ( $(menu_div+' a').index(this) == stan ) { return false; } else { $(this).fadeTo(fade_To, opacity); };});            
            };
        };
        function show_title() {
            $(opis_div+' p').remove();
            $(opis_div+' h3').remove();
            var new_title = $("<h3></h3>");
            var new_opis = $("<p></p>");
            var title = $(full_div+' img').eq(index).attr("title");
            var opis = $(full_div+' img').eq(index).attr("alt");
            new_title.html(title);
            new_opis.html(opis);
            $(opis_div).append(new_title);
            $(opis_div).append(new_opis);
        };
        show_title();
        show_full();
        generic();        
}


Jesli do funkcji generic dodam jakikolwiek alert to wszystkie obrazki są dobrej szerokości. Bez alertu dzieje się tak jak już wcześniej pisałem.