[js] IE Problem :(

G

Goltergaul

Well-known member
ID: 17553
L
26 April 2006
480
7
Hi ich hoffe einer von euch kann mir helfen, das script ist nicht ganz kurz ;)

https://tiberianwars.gamona.de/test.php Schaut euch das mal mit dem firefox an, dann könnt ihr so nen Weg über die Map planen (schaut nach rechts unten im Bild). Im IE tut sich aber einfach nichts :/ Was habe ich da falsch gemacht?

Danke euch =)

Edit: dass der IE PNGs nicht korrekt anzeigt weiß ich, darstellen müsste er das ganze aber trotzdem?
 
Zuletzt bearbeitet:
Wenn du folgende Änderungen machst, würde das auch mit Opera richtig funktionieren ;)

1.) in der funktion "redraw" bei den top und left zuweisungen den Strichpunkt hinter px weglöschen (bzw. hinter die anführungszeichen verschieben)
2.) in der funktion "kill" den background nicht auf "null" setzen, sondern auf "none"

Der IE hat da scheinbar ein problem mit der Methode setAttribute.
Versuche es mal so:
"element.style.attribute = value"
Dies sollte im IE auch funktionieren.
 
ups nein existiert nicht :/

Ich kopiers mal schnell hier rein: Danke =)
Code: 
<script type="text/javascript">
      	
      	var x=<? echo $own_x; ?>;
            var y=<? echo $own_y; ?>;
            var maxclicks=10;
            var clicks=0;
            var trace = new Array();

            window.onload = function () {

                  // Cursor erstellen (32x32 px Grafik)
                  var cursor=document.createElement("div");
                  cursor.setAttribute("id","cursor");
                  cursor.setAttribute("style","position: absolute; top: " + ((y-2)*11) + "px; left: " + ((x-2)*11) + "px; width: 32px; height: 32px; background: url(images/dot.png);");

                  document.getElementById("map").appendChild(cursor);

                  // Trigger erstellen
                  var up=document.createElement("div");
                  up.setAttribute("id","trigger_up");
                  up.setAttribute("style","position: absolute; top: " + ((y-2)*11) + "px; left: " + ((x-1)*11) + "px; width: 10px; height: 10px; cursor: pointer; font-size: 6px;");
                  up.setAttribute("onmouseover","flash('trigger_up');");
                  up.setAttribute("onmouseout","kill('trigger_up');");
                  up.setAttribute("onclick","move('up')");

                  document.getElementById("map").appendChild(up);
                  
                  var right=document.createElement("div");
                  right.setAttribute("id","trigger_right");
                  right.setAttribute("style","position: absolute; top: " + ((y-1)*11) + "px; left: " + (x*11) + "px; width: 10px; height: 10px; cursor: pointer; font-size: 6px;");
                  right.setAttribute("onmouseover","flash('trigger_right');");
                  right.setAttribute("onmouseout","kill('trigger_right');");
                  right.setAttribute("onclick","move('right')");

                  document.getElementById("map").appendChild(right);

                  var down=document.createElement("div");
                  down.setAttribute("id","trigger_down");
                  down.setAttribute("style","position: absolute; top: " + (y*11) + "px; left: " + ((x-1)*11) + "px; width: 10px; height: 10px; cursor: pointer; font-size: 6px;");
                  down.setAttribute("onmouseover","flash('trigger_down');");
                  down.setAttribute("onmouseout","kill('trigger_down');");
                  down.setAttribute("onclick","move('down')");

                  document.getElementById("map").appendChild(down);
                  
                  var left=document.createElement("div");
                  left.setAttribute("id","trigger_left");
                  left.setAttribute("style","position: absolute; top: " + ((y-1)*11) + "px; left: " + ((x-2)*11) + "px; width: 10px; height: 10px; cursor: pointer; font-size: 6px;");
                  left.setAttribute("onmouseover","flash('trigger_left');");
                  left.setAttribute("onmouseout","kill('trigger_left');");
                  left.setAttribute("onclick","move('left')");
                  
                  document.getElementById("map").appendChild(left);
                  
                  document.Form.koords.value="";
            }

            function move(where) {
                  // Aktiviere Form ButtonS
                  document.Form.button.disabled="";

                  if(where == "up") { y--; }
                  if(where == "right") { x++; }
                  if(where == "down") { y++; }
                  if(where == "left") { x--; }
                  clicks++;

                  // Hinterlasse "Spur"
                  trace[clicks]=document.createElement("div");
                  trace[clicks].setAttribute("id", "tracedot_" + clicks);
                  trace[clicks].setAttribute("style", "position: absolute; top: " + ((y-1)*11) + "px; left: " + ((x-1)*11) + "px; width: 10px; height: 10px; background: url(images/radargrafik_dot.png); font-size: 6px;");
                  document.getElementById("map").appendChild(trace[clicks]);

                  if(clicks < maxclicks) {
                        redraw();
                  } else {
                        stop();
                  }
            }

            function redraw() {
                  // Wegpunkt ausgeben
                  if(document.Form.koords.value == "") {
                        document.Form.koords.value=document.Form.koords.value + y + "," + x;
                  } else {
                        document.Form.koords.value=document.Form.koords.value + "|" + y + "," + x;
                  }
                  document.getElementById("data").innerHTML=document.getElementById("data").innerHTML + " (" + y + "," + x + ")";

                  // Cursor verschieben
                  document.getElementById("cursor").style.top=((y-2)*11) + "px";
                  document.getElementById("cursor").style.left=((x-2)*11) + "px";

                  // Trigger verschieben
                  document.getElementById("trigger_up").style.top=((y-2)*11) + "px";
                  document.getElementById("trigger_up").style.left=((x-1)*11) + "px";

                  document.getElementById("trigger_right").style.top=((y-1)*11) + "px";
                  document.getElementById("trigger_right").style.left=((x-0)*11) + "px";

                  document.getElementById("trigger_down").style.top=((y-0)*11) + "px";
                  document.getElementById("trigger_down").style.left=((x-1)*11) + "px";

                  document.getElementById("trigger_left").style.top=((y-1)*11) + "px";
                  document.getElementById("trigger_left").style.left=((x-2)*11) + "px";
            }

            function stop() {
                  // Wegpunkt ausgeben
                  if(document.Form.koords.value == "") {
                        document.Form.koords.value=document.Form.koords.value + y + "," + x;
                  } else {
                        document.Form.koords.value=document.Form.koords.value + "|" + y + "," + x;
                  }
                  document.getElementById("data").innerHTML=document.getElementById("data").innerHTML + " (" + y + "," + x + ")";

                  // Cursor verbergen
                  document.getElementById("cursor").style.visibility="hidden";

                  // Trigger verbergen
                  document.getElementById("trigger_up").style.visibility="hidden";
                  document.getElementById("trigger_right").style.visibility="hidden";
                  document.getElementById("trigger_down").style.visibility="hidden";
                  document.getElementById("trigger_left").style.visibility="hidden";

                  // Endkreuz plazieren
                  var stopper=document.createElement("div");
                  stopper.setAttribute("id", "stopper");
                  stopper.setAttribute("style", "position: absolute; top: " + ((y-1)*11) + "px; left: " + ((x-1)*11) + "px; width: 10px; height: 10px; background: url(images/radargrafik_dot_close.png); font-size: 6px; cursor: pointer;");
                  stopper.setAttribute("onclick","reset()");
                  document.getElementById("map").appendChild(stopper);

            }

            function reset() {
                  if(clicks > 0) {

                        // entferne Spur
                        var count=1;
                        while(count<=clicks) {
                              document.getElementById("map").removeChild(trace[count]);
                              count++;
                        }
                        // entferne Endkreuz
                        if(document.getElementById("stopper")) { document.getElementById("map").removeChild(document.getElementById("stopper")); }

                        // Lade Cursor & trigger wieder
                        x=<? echo $own_x; ?>;
                        y=<? echo $own_y; ?>;
                        document.getElementById("cursor").setAttribute("style","position: absolute; top: " + ((y-2)*11) + "px; left: " + ((x-2)*11) + "px; width: 32px; height: 32px; background: url(images/dot.png); visibility: visible;");

                        document.getElementById("trigger_up").setAttribute("style","position: absolute; top: " + ((y-2)*11) + "px; left: " + ((x-1)*11) + "px; width: 10px; height: 10px; cursor: pointer; font-size: 6px; visibility: visible;");
                        document.getElementById("trigger_right").setAttribute("style","position: absolute; top: " + ((y-1)*11) + "px; left: " + (x*11) + "px; width: 10px; height: 10px; cursor: pointer; font-size: 6px; visibility: visible;");
                        document.getElementById("trigger_down").setAttribute("style","position: absolute; top: " + (y*11) + "px; left: " + ((x-1)*11) + "px; width: 10px; height: 10px; cursor: pointer; font-size: 6px; visibility: visible;");
                        document.getElementById("trigger_left").setAttribute("style","position: absolute; top: " + ((y-1)*11) + "px; left: " + ((x-2)*11) + "px; width: 10px; height: 10px; cursor: pointer; font-size: 6px; visibility: visible;");

                        // Resette counter
                        clicks=0;
                        document.getElementById("data").innerHTML="";
                        document.Form.koords.value="";
                        document.Form.button.disabled="true";
                  }
            }

            function flash(what) {
                  document.getElementById(what).style.background='url(images/radargrafik_motiondot.gif)';
            }

            function kill(what) {
                  document.getElementById(what).style.background='none';
            }
      </script>
 
Irgendwie wärs noch schön was komplettes zu haben.
dat issn javascript, welches NICHT aufgerufen wird. Ich setz' mich nicht hin (auch wenn ich schon sitze) und schreib nen PHP-kram außenrum ;)

bist du dir hiermit sicher?:
window.onload = function ()
Zum Vergrößern anklicken....

ssollte es nicht
window.onload = function lade()
Zum Vergrößern anklicken....
lauten?

so auf den ersten blick... den rest geb ich mir später :D
 
Zuletzt bearbeitet:
hm weiß ich nicht genau. davor hatte ich dort garkeine funktion. lief im IE 7 aber auch nicht :/ Danke für deine Mühe. Das ist überigens das gesammte script. Und es läuft auch gut, nur eben nicht im IE 7 wo es eig sollte. Leider weiß ich nicht woran es liegt :(
 
mein standard-browser is opera und es funktioniert nicht!
ebenso mit IE6+7 und dem firefox.
alles was ich sehe ist nix
 
Frage: Wie willst du da jetzt was sehen? Die Bilder un zugehörigen Div container fehlen. Vll schaffe ich es das ganze nochmal komplett online zu stellen, aber jetzt mag ich ins Bett. Ich versuchs morgen wenn ich zeit hab, bin bissl im Stress wegen Klausur am Freitag ;)

Das Script geht jedenfalls, auch in Opera soweit ich weis (hab es nicht eigenhändig getestet) Jedenfalls geht es jetzt nurnoch darum herauszufinden welche von den ganzen Befehlen der IE nicht kann.
 
NuCHiLL schrieb:
Irgendwie wärs noch schön was komplettes zu haben.
dat issn javascript, welches NICHT aufgerufen wird. Ich setz' mich nicht hin (auch wenn ich schon sitze) und schreib nen PHP-kram außenrum ;)
[...]
Zum Vergrößern anklicken....

Goltergaul schrieb:
hm weiß ich nicht genau. davor hatte ich dort garkeine funktion. lief im IE 7 aber auch nicht :/ Danke für deine Mühe. Das ist überigens das gesammte script. Und es läuft auch gut, nur eben nicht im IE 7 wo es eig sollte. Leider weiß ich nicht woran es liegt :(
Zum Vergrößern anklicken....

Goltergaul schrieb:
Frage: Wie willst du da jetzt was sehen? Die Bilder un zugehörigen Div container fehlen. Vll schaffe ich es das ganze nochmal komplett online zu stellen, aber jetzt mag ich ins Bett. Ich versuchs morgen wenn ich zeit hab, bin bissl im Stress wegen Klausur am Freitag ;)[...]
Zum Vergrößern anklicken....

fällt dir was auf?
wie auch immer, wenn das nur im IE7 nicht läuft würde ich mir keine sooo großen gedanken machen, da der browser z.Zt. nur als beta downzuloaden ist. wer istalliert sich schon ne beta von M$? *duck und weg*
 
Das ist überigens das gesammte script.
Ist es ja auch ;) Das HTML Fehlt halt. Naja ist ja jetzt auch egal. Es geht darum dass der IE es generell nicht kann. Also auch nicht der 6er. Im 7er soll es aber angeblich gehen, de facto tu es das aber nicht.
(setAttribute kann der IE 6 nicht, der 7er soll es können)
Also muss es noch an irgendetwas liegen. :/
 
meine bereiche sind eher C# und Delphi...
kann es sein, dass setAttribute setAttributes heißen muss?

wenn nicht bin ich raus... sry!
 
wobei ich immernoch nicht verstehe wozu du die Funktion überhaupt brauchst... Warum nicht einfach
PHP: 
cursor.id = "cursor";
cursor.style.postion= "absolute";
cursor.style.top = ((y-2)*11)+"px";
cursor.style.left = ((x-2)*11)+"px";
cursor.style.width = "32px";
cursor.style.height = "32px"
cursor.style.backgroundImage = "images/dot.png";
//usw
window.onload = function () { quelltext }:arrow:window.onload = new Function ( quelltext )
 
burnred schrieb:
wobei ich immernoch nicht verstehe wozu du die Funktion überhaupt brauchst... Warum nicht einfach
PHP: 
cursor.id = "cursor";
cursor.style.postion= "absolute";
cursor.style.top = ((y-2)*11)+"px";
cursor.style.left = ((x-2)*11)+"px";
cursor.style.width = "32px";
cursor.style.height = "32px"
cursor.style.backgroundImage = "images/dot.png";
//usw
window.onload = function () { quelltext }:arrow:window.onload = new Function ( quelltext )
Zum Vergrößern anklicken....

Weils verdammt umständlich ist für jedes Attribut eine Zeile code zu haben :/
aber wenns wirklich nicht anders gehen soll... :(
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Ähnliche Themen

Zicklein444
Umfragen, technisches Problem
Antworten
3
Aufrufe
613
Zicklein444
Zicklein444
domino
Problem bei »Alle Cookies aktivieren.«
Antworten
1
Aufrufe
2K
klamm
klamm
Zurück
Oben