Alain: wird bei new Image() automatisch vorgeladen?

Beitrag lesen

hi twb,

Nicht mal lokal, nicht ein einziges Mal in drei Jahren. Kein Scherz. Ich war echt überrascht über den Inhalt Deines Postings. (Dessen Inhalt allerdings durchaus stringent war, wie ich gern zugebe.)

mir ist da an deinem script auch was aufgefallen:
Du benutzt nur document.getElementById ,was gewissen browser probleme bereiten dürfte bzw. deine seite erst gar nicht anzeigt.
Ich habe jetzt trotzdem auch mal nen loader erstellt für meine index seite,welches so ähnlich aussieht:
var ypos=180; //POSITION OF LOAD BAR FROM TOP OF WINDOW, IN PIXELS
var loadcol='red';      // PROGRESS BAR COLOR
var unloadcol='blue';   // BGCOLOR OF UNLOADED AREA
var barheight=20;      // HEIGHT OF PROGRESS BAR IN PIXELS (MIN 20)
var barwidth=200;     // WIDTH OF THE BAR IN PIXELS
var bordcol='black'; // COLOR OF THE BORDER

var NS4 = (document.layers)? true : false;
var IE = (document.all)? true : false;
var NS6 = (document.getElementById)? true : false;
var images=new Array
('vorladebilder.jpg',
'vorladebilder1.jpg',//exit
'vorladebilder2.jpg',//deutsch enter
'vorladebilder3.jpg',//englisch enter
'etc.jpg');
var imgdone=false;
var size=barwidth/(images.length);
barheight=Math.max(barheight,20);
var load=0, perouter, perdone, img=new Array();

//ab hier folgt der displaybalken
var txt=(NS4)?'<center><layer name="perouter" bgcolor="'+bordcol+'" visibility="hide">' : '<div id="perouter" style="position:absolute; visibility:hidden; background-color:'+bordcol+'">';
txt+='<table border="0" cellspacing="0" cellpadding="0"><tr><td width="'+barwidth+'" height="'+barheight+'" align="center">';
if(NS4)txt+='<ilayer width="100%" height="100%"><layer width="100%" height="100%" bgcolor="'+unloadcol+'" top="0" left="0">';
txt+='<table border="0" cellspacing="0" cellpadding="0"><tr><td align="center" width="'+barwidth+'" height="'+barheight+'" bgcolor="'+unloadcol+'"><font color="'+loadcol+'" size="2" face="sans-serif">Loading... </font></td></tr></table>';
if(NS4) txt+='</layer>';
txt+=(NS4)? '<layer name="perdone" width="100%" height="'+barheight+'" bgcolor="'+loadcol+'" top="0" left="0">' : '<div id="perdone" style="position:absolute; top:1px; left:1px; width:'+barwidth+'px; height:'+barheight+'px; background-color:'+loadcol+'; z-index:100">';
txt+='<table border="0" cellspacing="0" cellpadding="0"><tr><td align="center" width="'+barwidth+'" height="'+barheight+'" bgcolor="'+loadcol+'"><font color="'+unloadcol+'" size="2" face="sans-serif">Loading... </font></td></tr></table>';
txt+=(NS4)? '</layer></ilayer>' : '</div>';
txt+='</td></tr></table>';
txt+=(NS4)?'</layer>' : '</div>' ;
document.write(txt);
function loadimages(){
if(NS4){
perouter=document.perouter;
perdone=document.perouter.document.layers[0].document.perdone;
}
if(NS6){
perouter=document.getElementById('perouter');
perdone=document.getElementById('perdone');
}
if(IE){
perouter=document.all.perouter;
perdone=document.all.perdone;
}
cliplayer(perdone,0,0,barheight,0);
window.onresize=setouterpos;
setouterpos();
for(n=0;n<images.length;n++){
img[n]=new Image();
img[n].src=images[n];
setTimeout('checkload('+n+')' ,n*60);
}}
function setouterpos(){
var ww=(IE)? document.body.clientWidth : window.innerWidth;
var x=(ww-barwidth)/2;
if(NS4){
perouter.moveTo(x,ypos);
perouter.visibility="show";
}
if(IE||NS6){
perouter.style.left=x+'px';
perouter.style.top=ypos+'px';
perouter.style.visibility="visible";
}}
function dispbars(){
load++;
cliplayer(perdone, 0, size*load, barheight, 0);
if(load>=images.length)setTimeout('hideperouter()', 300);
}
function checkload(index){
(img[index].complete)? dispbars() : setTimeout('checkload('+index+')', 40);
status='Wait...images loading...';
}
function hideperouter(){
(NS4)? perouter.visibility="hide" : perouter.style.visibility="hidden";
imgdone=true;
status='loading complete!';
}
function cliplayer(layer, ct, cr, cb, cl){
if(NS4){
layer.clip.left=cl;
layer.clip.top=ct;
layer.clip.right=cr;
}
if(IE||NS6)layer.style.clip='rect('+ct+' '+cr+' '+cb+' '+cl+')';
}

das problem bei mir jetzt ist,ich würde gerne noch einen 0-100% anzeige drinnen haben beim loaden als nur den load balken.
Aber diese version sollte bei den meisten gängigen browser funktionieren.
Gruss
Alain