• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

[JavaScript] Bildbewegung Kombatibilität Firefox

M

mheppie

New member
Hallo Zusammen,

ich grübel jetzt schon ne ganze Weile, warum der Firefox mein Bild weder anzeigt, noch bewegt, während der Internet Explorer das tadellos tut.
Verschiedene Varianten habe ich nun schon ausprobiert und bin jetzt bei nachfolgendem Stand, aber irgendwas will der Firefox gar nicht.

Zum Code:
Ein Bild bewegt sich von rechts nach links und beschreibt dabei eine kleine Kurve, während es sich vergrößert. An einer bestimmten Position soll das Bild stehen bleiben.

Code: 
<div id="myLayer" style="position:absolute; left:1160px; top:670px; width:32px; height:20px; z-index:9; border: 1px none #000000; display:block"><img id="avo" src="../pics/avocado.png" width="1px" height="1px"></div>


<script type="text/javascript">  

                var a = 1200; 
	  var b = 670;
	  var c = 2;
	  var ac = 10;
	  var hw = 2; 
	  var h = 0;
	  var w = 32;
       
      function wandern() 
      { 
         if ( document.all ) // für den alten MSIE 
         { 
            document.all.myLayer.style.left = a + "px"; 
            document.all.myLayer.style.top = b + "px"; 
            document.all.avo.style.height = h + "px"; 
            document.all.avo.style.width = w + "px"; 
         } 
         else if ( document.layers ) // für Netscape 
         { 
            document.myLayer.left = a + "px"; 
            document.myLayer.top = b + "px"; 
            document.avo.height = h + "px"; 
            document.avo.width = w + "px"; 
         } 
         else if ( document.getElementById ) // für moderne Browser 
         { 
            document.getElementById("myLayer").style.left = a + "px"; 
            document.getElementById("myLayer").style.top = b + "px";
            document.getElementById("avo").offsetHeight = h + "px";
            document.getElementById("avo").offsetWidth = w + "px";
         } 
          
         
		/* b = b + c;*/ 
		 a = a - ac;
		 h = h + hw;
		 w = w + hw;
		 
	     timer = window.setTimeout( 'wandern()', 50 );
		 
		 if ( a <= 680 )
		 {
		              if ( b >= 550 )
			{
			     b = b - c;
			}
		
		}
		 
		 
          
                           if ( a <= 165 )
                           { 
		 	a = 165;
                                          b = 553; 
			h = 194;
			w = 228;

 			wait(); 
   			clearTimeout(timer);
                            } 
		 
      }
</script>

Ich tippe auf eine falsche Syntax, sehe aber aktuell den Wald vor lauter Bäumen nicht.

Freue mich über jede Anregung.

LG

MHeppie
 
Die Fehlerkonsole ist leider leer. Sonst wärs vielleicht einfacher :)

Meinst Du, dass diese Weiche so stören kann?

Kann erst heute abend wieder testen, nehme diesen Hinweis aber gern auf.
 
Ich starte das Script beim Laden der Seite.


Dass das bei Dir funktioniert, läßt mich noch mehr grübeln ...
 
Guten Abend,

es doch verrückt! Wenn Du mir schreibst, dass mein Script bei Dir im Firefox funktioniert, dann verstehe ich es echt nicht mehr.:confused:

Ich habe jetzt diesen Code in eine HMTL-Seite gepresst:

Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Unbenanntes Dokument</title>
<script type="text/javascript">  

                var a = 1200; 
	  var b = 670;
	  var c = 2;
	  var ac = 10;
	  var hw = 2; 
	  var h = 0;
	  var w = 32;
       
      function wandern() 
      { 
         if ( document.all ) // für den alten MSIE 
         { 
            document.all.myLayer.style.left = a + "px"; 
            document.all.myLayer.style.top = b + "px"; 
            document.all.avo.style.height = h + "px"; 
            document.all.avo.style.width = w + "px"; 
         } 
         else if ( document.layers ) // für Netscape 
         { 
            document.myLayer.left = a + "px"; 
            document.myLayer.top = b + "px"; 
            document.avo.height = h + "px"; 
            document.avo.width = w + "px"; 
         } 
         else if ( document.getElementById ) // für moderne Browser 
         { 
            document.getElementById("myLayer").style.left = a + "px"; 
            document.getElementById("myLayer").style.top = b + "px";
            document.getElementById("avo").offsetHeight = h + "px";
            document.getElementById("avo").offsetWidth = w + "px";
         } 
          
         
		/* b = b + c;*/ 
		 a = a - ac;
		 h = h + hw;
		 w = w + hw;
		 
	     timer = window.setTimeout( 'wandern()', 50 );
		 
		 if ( a <= 680 )
		 {
		              if ( b >= 550 )
			{
			     b = b - c;
			}
		
		}
		 
		 
          
                           if ( a <= 165 )
                           { 
		 	a = 165;
                                          b = 553; 
			h = 194;
			w = 228;

 			
   			clearTimeout(timer);
                            } 
		 
      }
</script>


</head>

<body onLoad="wandern();">

<div id="myLayer" style="position:absolute; left:1160px; top:670px; width:32px; height:20px; z-index:9; border: 1px none #000000; display:block"><img id="avo" src="avocado.png" width="1px" height="1px"></div>





</body>
</html>

Wenn ich diese Datei im IE öffne, sehe ich ein sich bewegendes Bild. Im Firefox sehe ich nichts. Die Fehlerkonsole gibt mir nichts aus.
Noch eine Idee?
 
Das Bild sehen ist relativ, da du es auf einen Pixel verkleinert hast ist es fast unsichtbar.

Nachtrag: Wobei man aber dazu sagen muss, dass die Einheit an der Stelle falsch ist, anscheinend mal wieder etwas wo der IE sich vernünftiger verhält und die Angabe ignoriert.
 
Vielen Dank!!!
Endlich ein Hinweis, der auf fruchtbaren boden viel.

Das Bild war tatsächlich nicht zu sehen, weil es so klein war. Das ist ja schon mal ein Ansatz.
Allerdings soll das Script das Bild während der Flugphase ja auch vergrößern. Das mag er nun wieder nicht. (nicht mit dem Script :) )
IE gehts, FF nicht :(

(Die Einheit habe ich wegen dem Firefox hineingebaut. Normaler Weise habe ich noch mehr Grafiken auf der Seite und der Firefox hat immer über das Attribut 'height' geschimpft. und da habe ich pauschal überall die Einheiten eingebaut und der Browser war beruhigt.)
 
Zuletzt bearbeitet:
mheppie schrieb:
(Die Einheit habe ich wegen dem Firefox hineingebaut. Normaler Weise habe ich noch mehr Grafiken auf der Seite und der Firefox hat immer über das Attribut 'height' geschimpft. und da habe ich pauschal überall die Einheiten eingebaut und der Browser war beruhigt.)
Zum Vergrößern anklicken....
Du hast da viel durcheinander. Das HTML Attribut height ist etwas anderes als das height Attribut von style und offsetWidth ist nur ein lesbarer Wert. Das HTML Attribut height/width darf keine Einheit haben, die style Attribute height/width/left/top müssen eine haben.

Bei dir funktoniert es, weil der IE den Code der eigentlich für den IE 4 gedacht ist ausführt. Schmeiss mal document.all und document.layers aus deinem Code raus! Es gibt keine Browser mehr, die das brauchen.

Und dann ändere die Größe über den Wert der dafür gedacht ist: style.height
wobei bei Bildern kannst du auch einfach nur height verwenden.
 
Hallo Schlauer,

das hat gepasst.
Dieses style.height war anfangs meine erste Wahl. Sicher waren damals noch andere Kleinigkeiten ausschlaggebend, dass der FF nicht wollte. Und so habe ich vieles genau an dieser Stelle/diesen Stellen ausprobiert. Diverse Foren schrieben dann, man muss es mit offset oder client versehen, damit es richtig funktioniert. War wohl eine Fehlinformation. Danke, dass du mir die richtige Bedeutung zu diesem Attribut erklärt hast.

Nebenbei: nur mit height/width wollte er aber auch nicht.

Es ist schon erstaunlich, was man dem IE alles vorwerfen kann und er macht trotzdem genau das, was man sich vorgestellt hat. Während des ganzen Herumprobierens liefen alle Versionen einwandfrei auf dem IE. Und ohne Fehlermeldungen in der Konsole ist man schon aufgeschmissen. Da ist es gut, wenn dann ein zweites Augenpaar aus einem anderen Winkel mal draufschaut.

Ich habe die Einheiten natürlich wieder herausgenommen. Die Weiche habe ich trotzdem gelassen. Ich bin abwärtskombatibel erzogen worden und das kriegt man nicht so leicht los;)

Vielen Dank nochmals.

---------

Von meiner Seite wäre dieser Thread abgeschlossen.

---------
 
mheppie schrieb:
Dieses style.height war anfangs meine erste Wahl. Sicher waren damals noch andere Kleinigkeiten ausschlaggebend, dass der FF nicht wollte. Und so habe ich vieles genau an dieser Stelle/diesen Stellen ausprobiert. Diverse Foren schrieben dann, man muss es mit offset oder client versehen, damit es richtig funktioniert. War wohl eine Fehlinformation. Danke, dass du mir die richtige Bedeutung zu diesem Attribut erklärt hast.
Zum Vergrößern anklicken....
offsetWidth/Height brauchst du, wennn du die Maße ermitteln willst.

mheppie schrieb:
Es ist schon erstaunlich, was man dem IE alles vorwerfen kann und er macht trotzdem genau das, was man sich vorgestellt hat. Während des ganzen Herumprobierens liefen alle Versionen einwandfrei auf dem IE.
Zum Vergrößern anklicken....
Weil du in der Weiche etwas anderes machst, als dort wo du alle anderen Browser bedienst. Du hast vorhewr halt nur dem IE den richitgen Code gegeben, allen anderen den falschen. Insofern ist es kein Leistung das er funktioniert.

mheppie schrieb:
Die Weiche habe ich trotzdem gelassen. Ich bin abwärtskombatibel erzogen worden und das kriegt man nicht so leicht los;)
Zum Vergrößern anklicken....
Wie gesagt, das ist für 4'er Browser. Mit denen kannst du deine Seite vermutlich gar nicht mehr anschauen. Als ich noch den IE 4 benutzt hatte - so gegen 2002 - stürzte er bei jeder 2. Seite ab und den Netscape konntest du so gut wie gar nicht mehr benutzen, zumal er mit CSS kaum zurecht kam.

Insofern ist das vergebliche Liebesmühe und wie gesagt, es hat dazu geführt, dass du falschen Code benutzt hast. Hättest du den Code, den du im IE 4 Block verwendet hast, im DOM Block verwendet, wäre das Skript in allen Browsern gelaufen.
 
mheppie schrieb:
Es ist schon erstaunlich, was man dem IE alles vorwerfen kann und er macht trotzdem genau das, was man sich vorgestellt hat. Während des ganzen Herumprobierens liefen alle Versionen einwandfrei auf dem IE.
Zum Vergrößern anklicken....

Das stimmt. IE hat Probleme, aber an Stellen, an denen andere Browser scheitern, schafft er's auf einmal wieder...

mheppie schrieb:
Ich bin abwärtskombatibel erzogen worden und das kriegt man nicht so leicht los...
Zum Vergrößern anklicken....

*schmunzel* Nicht schlecht, der Spruch ;)
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben