image map über xml festlegen und animieren

[mikdoe]

Ich werd mich jetzt mal mit den "Closures" befassen (was auch immer das ist )...hoffentlich komm ich drauf

Beispielsweise die folgende Zeile ist ein closure:
mouseover(function() {....})

[cysign]

Ah, jetzt hab ichs. Die Closures waren schon richtig gesetzt.
Aber $('area'+i).animate({ konnte nicht funktionieren, weil _in_ dem Closure das i nicht definiert war?
$(this).animate({ jedenfalls funktioniert. Danke

[cysign]

Und schon häng ich wieder fest
mit

for (var j = 0; j < irgendwas.childNodes.length; j++) {
                with (irgendwas.childNodes[j]) {
                   if (nodeName == "xworldmap") {
                      xworldmap = firstChild.nodeValue;
                      alert(xworldmap);
                   }
                }
             }

bekomme ich sauber meine beiden xworldmap-werte aus meiner XML-datei.
allerdings liegt diese for-schleife _innerhalb_ der for-schleife, die meine DIV-Boxen erstellt.
Die erste box, die in der äußeren For-Schleife erstellt wird, bekommt uach den zugeordneten xworldmap-Wert.
Die zweite Box bekommt statt der 250 aus der XML-Datei keinen Wert übermittelt.
nun würde ich gerne die FOR-Schleife innerhalb der For-Schleife auflösen, da due äußere schon den Laufindex liefert. Allerdings wieß ich nicht, wie ich dann an den Wert aus der XML-Datei ran komme.

[cysign]

Hmpf...dämlicher Fehler. Ich hatte den Wert übergeben...aber keine Einheit. Jetzt hab ich px drangehangen und es funktioniert

xworldmap = firstChild.nodeValue+"px";

[cysign]

Och noe, das gibts doch nciht. Da denk ich, dass ich mal weiter gekommen bin...und dann verarscht mich der Internetexplorer
Warum vermietet man dieses blöde Ding nicht endlich?!
Kann vielleicht jemand mal nen Blick drauf werfen?
http://spili.aeroconcept.de/temp/index.htm
und
http://spili.aeroconcept.de/temp/js/xmlareas.js

Im Firefox gehts so, wie es soll...aber im IE gibt der beim Draufklicken die ID nicht aus und das Hovern klappt auch nur einmal.
Bei nem vorherigen Versuch, als ich noch nicht die DIVs aus dem XML erstellen konnte, hat der das aber problemlos mitgemacht.

[kkapsner]

OK - ich hab' das Problem nach langem suchen gefunden: wenn du einem Element im IE eine Transparenz verpasst reagiert es nur noch bei den sichtbaren Teilen (bei dir also der Rand) auf irgendwelche Mausaktionen => Lösung: dem Hauptelement keine Opacity verpassen, sondern ein Kindelement erzeugen, das den Rand und den Text darstellt, und nur diesem die Opacity geben (Bsp: http://kkjs.kkapsner.de/tests/mousee...city_test.html)

[tsseh]

OK - ich hab' das Problem nach langem suchen gefunden: wenn du einem Element im IE eine Transparenz verpasst reagiert es nur noch bei den sichtbaren Teilen (bei dir also der Rand) auf irgendwelche Mausaktionen

???

Lösung: dem Hauptelement keine Opacity verpassen, sondern ein Kindelement erzeugen, das den Rand und den Text darstellt, und nur diesem die Opacity geben (Bsp: http://kkjs.kkapsner.de/tests/mousee...city_test.html)

ne, du sorgst dafür, das das element, welches die events hat sich nicht verkleinert und dadurch sofort mouseout auslöst.

EDIT: habs gerade mal probiert, du hast recht. es funktioniert nur auf dem "sichtbaren" Teilen.
aber mit der Opacity hat das nichts zu tun. auch ohne diese gesetz zu haben kommen keine events
http://support.microsoft.com/kb/262559/en-us?fr=1

[kkapsner]

@hesst: hm... stimmt auch irgendwie - nur ohne opacity reagiert das Element trotzdem auf mouseenter/mouseleave... sonst würde mein Beispiel ja nicht funktionieren.

PS: wenn du von oben links in das Element reinfährst hast du das Wechselspiel zw. mouseenter/leave nicht.

[tsseh]

@hesst: hm... stimmt auch irgendwie - nur ohne opacity reagiert das Element trotzdem auf mouseenter/mouseleave... sonst würde mein Beispiel ja nicht funktionieren.

Bei dir reagiert das "verdeckte" Element (test) auf mouseenter/mouseleave würde ich sagen - ohne das jetzt getestet zu haben - obwohl es auch nichts sichtbares enthällt, weil das ganze ja ein "feature" sein soll und wohl nur einstufig gelöst wurde - reine vermutung.

[kkapsner]

Wenn du die Opacity komplett raus nimmst funktioniert's auch ohne Kindelement...

[tsseh]

nicht bei mir???? da geht es erst mit background

[kkapsner]

Welcher IE? In meinem IE8/7 funktioniert's dann.

[tsseh]

Welcher IE? In meinem IE8/7 funktioniert's dann.

ie7

<html>
  <head>
    <title>test</title>
  </head>
  <style type="text/css">
    #test{
    	position: absolute;
    	top: 20px;
    	left: 50px;
    	width: 200px;
    	height: 100px;
    	border: 1px solid red;
    }
  </style>
    <script type="text/javascript">
      function out(txt, elem)
      {
        var nodeOut = document.getElementById("out");
        var nodeElem = document.createElement(elem || "div");
        var nodeText = document.createTextNode(txt);
        nodeElem.appendChild(nodeText);
        nodeOut.appendChild(nodeElem);
      }
      window.onload = function()
      {
        var test = document.getElementById("test");
        test.onmouseover = function() { out("onmouseover"); }
        test.onclick = function() { out("onclick"); }
      }
    </script>
  <body>
    <div id="test"></div>
    <div id="out"></div>
  </body>
</html>

[kkapsner]

1. Quirksmode
2. im IE8 funktioniert's.
3. wenn ich im IE8 auf IE7 im quirksmode stelle funktioniert's, wenn ich aber auf IE7-Standard stelle funktioniert auch mein Beispiel nicht mehr... sehr seltsam - ist hald IE... abr wenn ich dem DIV "test" ein Hintergrundbild gebe, das total transparent ist (z.B. ein 1x1 gif) funktioniert's wieder...

[tsseh]

3. wenn ich im IE8 auf IE7 im quirksmode stelle funktioniert's,

habe ich noch nicht probiert
EDIT:
gerade probiert, funktioniert nur solange kein anderes element(body scheint egal zu sein) an der mousepointer-stelle verdeckt wird.

wenn ich aber auf IE7-Standard stelle funktioniert auch mein Beispiel nicht mehr... sehr seltsam -

auch im echten IE7

ist hald IE... abr wenn ich dem DIV "test" ein Hintergrundbild gebe, das total transparent ist (z.B. ein 1x1 gif) funktioniert's wieder...

das stand ja auch als abhilfe im MSDN