nicht angemeldet
1.5 oder DOM2: Layer / Ebene / DIV / SPAN-Objekt-Bewegungen
Hallo,
bei Browsern die DOM2 unterstützen führt das mehrfache Ausführen von
Layerverschiebungen (DIV-Tags) zu starken Verzögerungen.
Ein Problem war oder ist, dass viele Browser document.all und document.layers auch unterstützen,
die if-Abfragen mit z.B. if(document.all) .. if (docuemnt.getElementById)..
die Verschiebungen doppelt ausführen oder das häufige if-Abfragen bremst.
Die Verzögerungen bei Opera und konqueror sind meist hier zu finden.
Daher sollten externe js-Dateien für verschiedene Browsertypen angelegt werden, z.B.:
[CODE]
if (document.getElementById) {
document.write("<scri+"pt type='text/javascript' src='DOM2.JS'>"+"</scri"+'pt>'");}
else if(document.all&&!document.getElementById){
document.write("<scri+"pt type='text/javascript' src='IE4.JS'>"+"</scri"+'pt>'");
else if(document.layers){
document.write("<scri+"pt type='text/javascript' language='JavaScript1.3' src='NC4.JS'>"+"</scri"+'pt>'");}
[/CODE]
Nun wird aber auch bei reiner DOM2-Programmierung das verschieben von dutzend Layern zum Problem,
daher habe ich dieses Testscript mit 4 Layern geschrieben und bitte Euch,das mal mit
ICab (MAC),IE(MAC),Opera,Amaya,HotJava,konqueror und Netscape6.x oder andere DOM2-fähige Browser zu testen.
Eine bessere Formel für den Landeanflug wäre auch nett.. Formel:
Vielen Dank schonmal für Euer Mitmachen ;-)
Bei mir machte das unter Netscape 6.21 schon 5 Sekunden aus,
bei 12 Layern wären das dann schon 15 Sekunden Verzögerung.
Es geht also um jede Mikrosekunde, die eingespart werden kann,
denn bei Onlinespielen sind bis zu 100 Layers in Bewegung:
[CODE]
<!doctype html public "-//W3C//DTD HTML 4.0 //EN">
<html>
<head>
<meta name="author" content="MichelM">
<meta name="copyright" content="http://www.michelm.com"
<meta name="generator" content="Quanta">
<title></title>
<script type="text/javascript" language="JavaScript1.4"> <!--
if(!document.getElementById){document.open();document.write("kein DOM2-Browser");document.close();}
var mmx=6;var mmy=24;xx=1;kk=0;mmywert=new Array();mmxwert=new Array();
var test1=new String();var test1e=new String();var test2=new String();var test2e=new String();
var ausgabe=new String();
starttime=new Date();myLayer=new Array();
/* Für Testausgabe Kommentare entfernen
info=window.open("","","width=400,height=400,scrollbars=1");
info.moveTo(400,10);
*/
function fly(){
starttime=new Date();
lande();
}
function lande(){
if(mmx<400){mmx+=3}
mmy+=(xx<=51)?Math.round(mmy*0.045):5;xx++;
if(document.getElementById){
document.getElementById("airplane").style.top=mmx+"px";
document.getElementById("airplane").style.left=mmy+"px";
document.getElementById("airplane1").style.top=mmx+"px";
document.getElementById("airplane1").style.left=mmy+"px";
testpI1=parseInt(document.getElementById("airplane1").style.left);
document.getElementById("airplane2").style.top=mmx+"px";
document.getElementById("airplane2").style.left=mmy+"px";
testPI2=parseInt(document.getElementById("airplane2").style.left)
document.getElementById("airplane3").style.top=mmx+"px";
document.getElementById("airplane3").style.left=mmy+"px";
testPI2=parseInt(document.getElementById("airplane3").style.left)
}
if(parseInt(document.getElementById("airplane").style.left)<=952){
starte=setTimeout("lande()",29);}
else{
clearTimeout("lande()");
endtime=new Date();
test1=navigator.platform+"<BR>"+navigator.userAgent+"<BR>"+starttime+" Millisekunden: "+starttime.getMilliseconds()+" Schritte:"+(xx-1)/2+"<BR>";test1e=endtime+" Millisekunden: "+endtime.getMilliseconds();fly2();}
}
function fly2(){
mmx=6;mmy=24;xx=0;
myLayer=document.getElementsByTagName("DIV");
for (vv=1;vv<=200;vv++) {
if(mmx<400){mmxwert[vv]=mmx+=3;}else{mmxwert[vv]=mmx;}
mmywert[vv]=mmy+=(xx<=50)?Math.round(mmy*0.045):5;
/*info.document.write(vv+" vv :"+mmywert[vv]+"<BR>"+mmxwert[vv]+"<BR>");*/
xx++;
}
starttime=new Date();
/*Quicklande() bei setTimeout in Quicklande */
setInterval("Quicklande()",29);
}
function Quicklande(){
kk++;
/* info.document.write(kk+" : "+mmywert[kk]+"<BR>"+mmxwert[kk]); */
myLayer[0].style.top=mmxwert[kk]+"px";
myLayer[0].style.left=mmywert[kk]+"px";
myLayer[1].style.top=mmxwert[kk]+"px";
myLayer[1].style.left=mmywert[kk]+"px";
myLayer[2].style.top=mmxwert[kk]+"px";
myLayer[2].style.left=mmywert[kk]+"px";
myLayer[3].style.top=mmxwert[kk]+"px";
myLayer[3].style.left=mmywert[kk]+"px";
if(kk<=199)
tuenichts=0;
/*{starte=setTimeout("Quicklande()",10);}*/
else{
clearInterval("Quicklande()");endtime=new Date();test2=navigator.platform+"<BR>"+navigator.userAgent+"<BR>"+starttime+" Millisekunden: "+starttime.getMilliseconds()+" Schritte:"+kk/2+"<BR>";test2e=endtime+" Millisekunden: "+endtime.getMilliseconds();
ausgabe="<span style='font-family:Verdana,Tahoma,Arail,Helvetica,sns-serif;font-size:14px;color:black'><P>Bitte kopieren und per Mail an <a href='mailto:iaweb@iaweb.org'>mich</A> oder im forum als Antwort eintragen</P><BR><BR> Ergebnis Test 1 ohne Vorausberechung und parseInt-Abfrage<BR>"+test1+test1e+"<BR><BR> Ergebnis Test 2 mit Vorausberechung<BR>"+test2+test2e;
document.write(ausgabe+"<P>Bitte ergänzen (sehr wichtig!):<LI>CPU:</LI><LI>Takt(MHZ):</LI><LI>RAM (MB):</LI><LI>Bustakt (MHZ):</LI><LI>Grafikkarte:</LI></SPAN>");
}
}
//--> :
</script>
</head>
<body onLoad="fly();">
<DIV id="airplane" name="airplane" style="position:absolute;top:-30px;left:-40px;" ><img src="./airplane.gif" width="80px" height="46px" alt="Bild fehlt!"></DIV>
<DIV id="airplane1" name="airplane1" style="position:absolute;top:-30px;left:-40px;" ><img src="./airplane.gif" width="80px" height="46px" alt="Bild fehlt!"></DIV>
<DIV id="airplane2" name="airplane2" style="position:absolute;top:-30px;left:-40px;" ><img src="./airplane.gif" width="80px" height="46px" alt="Bild fehlt!"></DIV>
<DIV id="airplane3" name="airplane3" style="position:absolute;top:-30px;left:-40px;" ><img src="./airplane.gif" width="80px" height="46px" alt="Bild fehlt!"></DIV>
<DIV style="position:absolute;top:429px;left:0px;"><HR></HR></DIV>
</body>
</html>
[/CODE]
-
Hallo,
abgesehen davon, das ich nur noch zwischen NS4.xy und DOM2-Browser unterscheide, und damit nur eine if-Anweisung brauch, solltest Du eine Demoseite mit Link setzen, denn manche, wie ich zur zeit, haben nicht genug Zeit bzw Muße, Deinen Text zu kopieren, abzuspeichern und dann im Browser zu laden..... wenn wir schon helfen sollen/dürfen ;-)))
Chräcker
-
Hallo,
abgesehen davon, das ich nur noch zwischen NS4.xy und DOM2-Browser unterscheide, und damit nur eine if-Anweisung brauch, solltest Du eine Demoseite mit Link setzen, denn manche, wie ich zur zeit, haben nicht genug Zeit bzw Muße, Deinen Text zu kopieren, abzuspeichern und dann im Browser zu laden..... wenn wir schon helfen sollen/dürfen ;-)))
Chräcker
kein problem
-
Hallo,
bleibt noch zu ergänzen, daß sich "dort" zweimal ein Flugzeug anschickt zu landen und man dann eine Ergebnisseite zum "weitersagen" an Michel bekommt.... tut also nicht weh ;-)
Chräcker
-
-
-
Hallo,
Ergebnis Test 1 ohne Vorausberechung und parseInt-Abfrage
Win32
Mozilla/4.0 (compatible; MSIE 5.5; Windows 98; Win 9x 4.90)
Fri Apr 26 00:08:53 UTC+0200 2002 Millisekunden: 430 Schritte:100
Fri Apr 26 00:09:09 UTC+0200 2002 Millisekunden: 360Ergebnis Test 2 mit Vorausberechung
Win32
Mozilla/4.0 (compatible; MSIE 5.5; Windows 98; Win 9x 4.90)
Fri Apr 26 00:09:09 UTC+0200 2002 Millisekunden: 360 Schritte:100
Fri Apr 26 00:09:26 UTC+0200 2002 Millisekunden: 720
Bitte ergänzen (sehr wichtig!):CPU: PentiumII
Takt(MHZ): 450
RAM (MB): 250 MB
Bustakt (MHZ): ergibt sich aus 1
Grafikkarte: ATIEigentlich nett, aber leider fliegt Dein Kunstflieger bei mir leicht über den rechten Bildschirmrand hinaus (19 Zoll). Das Tempo variiert auch in etwas unlogischer Weise.
Bis bald
Mathias Bigge
(daheim an seiner lahmen Kiste)