Struppi: wie mit JS nun Grafiken "wechseln"?

Beitrag lesen

http://www.atomic-eggs.com/z_testdir/html/juergen.shtml

Hier sind erstmal CSS und JavaScript ausgelagert. Das ganze JavaScript?

Ich hoffe ich darf mir hier ein paar Anmerkungen erlauben? Der Code ist noch nicht so schön. Du hantierst hier im Code mit globalen Variabeln rum, was einerseits unsauber ist und anderseits auch problematisch werden kann, da du z.b. name verwendest, was ein schon benutzer Wert ist. Auch die anderen sind unnötigerweise global. Und ich hab mal ein function Objekt daraus, das hat den Vorteil das du lokale Variabel definieren kannst, die im ganzen Objekt gültig sind.

Ich hab es mal ein bisschen modifiziert

var ShowGal = new function() {  
	var path = "http://www.atomic-eggs.com/roadster/20040228/";  
	var suffix = ".jpg";  
	var img = document.createElement("img");  
	var element = null;  
	img.onload = function() {  
		element.style.opacity = '1';  
	}  
	this.getFirst = function (name) {  
		var first_src = name;  
		img.src = first_src;  
        element.appendChild(img);  
    };  
	  
	this.fromFilm = function (name) {  
		element.style.opacity = '0.5';  
		img.src = name;  
		element.appendChild(img);  
    };  
	  
	this.init = function () {  
		  
        window.onload = function() {  
		element = document.getElementById('show');  
		ShowGal.getFirst(path + npart + start_pic + suffix);  
		var a = document.links;  
            for (i = 0; i < a.length; i++) {  
                if (a[i].className == 'thumbs') {  
                    a[i].onclick = function() {  
                        var num = this.href;         // eg http://www.atomic-eggs.com/z_testdir/scripts/perl/gallery.pl?url=/roadster/20040228/DSCN1000.jpg  
                        num = num.split('/').pop();  
  
						var name = path+ num;  
  
                        ShowGal.fromFilm(name);  
                        return false;  
                    }  
                }  
            }  
        }  
    }  
};  
ShowGal.init();

Struppi.