Stefan Rohloff: nicht-definierte Funktion wegen <!--[if IE]>

Hallo, ich habe mir als Ersatz für div:hover für den IE folgendes kleine Javascript gemacht:

<script type="text/javascript">
<!--[if IE]>
function einblenden() {
 document.getElementById("bruecke").style.display="block";
 document.getElementById("strich").style.display="block";
 document.getElementById("menu").style.display="block";}
function ausblenden() {
 document.getElementById("bruecke").style.display="none";
 document.getElementById("strich").style.display="none";
 document.getElementById("menu").style.display="none";}
<![endif]-->
</script>

und weiter unten dann:

<div id=“menubox“ onmouseover="einblenden()" onmouseout="ausblenden()">

Das ganze funktioniert auch gut, allerdings rufen ja so alle Browser außer dem IE Funktionen auf, die gar nicht existieren! Ich weiß nicht, ob das ein Problem ist?! Habe versucht, es so zu lösen:

<script type="text/javascript">
function einblenden() {
 <!--[if IE]>
 document.getElementById("bruecke").style.display="block";
 document.getElementById("strich").style.display="block";
 document.getElementById("menu").style.display="block";
 <![endif]-->
 }
function ausblenden() {
 <!--[if IE]>
 document.getElementById("bruecke").style.display="none";
 document.getElementById("strich").style.display="none";
 document.getElementById("menu").style.display="none";
 <![endif]-->
 }
</script>

Da würden die Funktionen existieren, wären aber ohne Inhalt. Das akzeptiert der IE aber nicht.

So habe ich es auch probiert:

<div id=“menubox“ <!--[if IE]> onmouseover="einblenden()" onmouseout="ausblenden()"<![endif]--> >

Aber das geht erst recht nicht ...
Hmm...

Oder ist das Aufrufen einer nicht definierten Funktion vielleicht gar kein Problem im Javascript, dann könnte ich es einfach so lassen wie es ist ... funktionieren tut es ja ...

Stefan

  1. Hello out there!

    <script type="text/javascript">
    <!--[if IE]>

    HTML-Kommentare haben in JavaScript ncihts zu suchen. Die conditional comments gehören außerhalb des script-Elements.

    <div id=“menubox“ onmouseover="einblenden()" onmouseout="ausblenden()">

    ^       ^
    Das hast du nicht wirklich so im Quelltext, oder?

    Das ganze funktioniert auch gut, allerdings rufen ja so alle Browser außer dem IE Funktionen auf, die gar nicht existieren! Ich weiß nicht, ob das ein Problem ist?!

    Ja, ich denk schon.

    Besser, du machst auch anderen Browsern diese Funktionen bekannt, die dann aber nichts tun:

    <!--[if IE]>  
      <script type="text/javascript">  
    [code lang=javascript]    function einblenden() {  
          document.getElementById("bruecke").style.display="block";  
          document.getElementById("strich").style.display="block";  
          document.getElementById("menu").style.display="block";  
        }  
        function ausblenden() {  
          document.getElementById("bruecke").style.display="none";  
          document.getElementById("strich").style.display="none";  
          document.getElementById("menu").style.display="none";  
        }
    

    </script>
    <![endif]-->

    <!--[if !IE]>-->
      <script type="text/javascript">

        function einblenden() {}  
        function ausblenden() {}
    

    </script>
    <!--<![endif]-->[/code]

    See ya up the road,
    Gunnar

    --
    “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
    1. <div id=“menubox“ onmouseover="einblenden()" onmouseout="ausblenden()">
                 ^       ^
      Das hast du nicht wirklich so im Quelltext, oder?

      Stimmt, die "" sind anders ... was dir alles auffällt! ;-)

      Besser, du machst auch anderen Browsern diese Funktionen bekannt, die dann aber nichts tun:

      <!--[if !IE]>-->
        <script type="text/javascript">

      function einblenden() {}

      function ausblenden() {}

      
      >   </script>  
      > <!--<![endif]-->[/code]  
        
      Super, das mit dem !IE kannte ich nicht ... vielen Dank!  
        
      Geht auch  
        
      <!--[if !lt IE 7]> ?  
        
      Für den Fall, dass der IE7 div:hover kennt, bräucht ich für ihn das Javascript ja auch nicht ...  
        
      Stefan
      
      1. Hello out there!

        Geht auch
        <!--[if !lt IE 7]> ?

        Hm, weiß nicht. Musste ausprobieren. Oder googlen.

        Mir ist aber noch eingefallen, dass du das gar nicht brauchst, wenn du die Logik (JavaScript) sauber vom Markup (HTML) trennst, also keine onmouseover- und onmouseout-Attribute verwendest.

        Stattdessen beschreibst du das Verhalten bei onmouseover und onmouseout da wo’s hingehört – im JavaScript-Bereich:

          document.getElementById("menubox").onmouseover = function()  
          {  
            document.getElementById("bruecke").style.display="block";  
            document.getElementById("strich").style.display="block";  
            document.getElementById("menu").style.display="block";  
          }  
          document.getElementById("menubox").onmouseover = function()  
          {  
            document.getElementById("bruecke").style.display="none";  
            document.getElementById("strich").style.display="none";  
            document.getElementById("menu").style.display="none";  
          }  
        
        

        Kannste so natürlich natürlich nicht im script-Element im head unterbringen, da zum Zeitpunkt der Verabreitung das Element "menubox" noch gar nicht existiert; das kommt ja erst später im body.

        Deshalb erst nach dem Laden des Dokuments ausführen:

        window.onload = function()  
        {  
          document.getElementById("menubox").onmouseover = function()  
          {  
            document.getElementById("bruecke").style.display="block";  
            document.getElementById("strich").style.display="block";  
            document.getElementById("menu").style.display="block";  
          }  
          document.getElementById("menubox").onmouseover = function()  
          {  
            document.getElementById("bruecke").style.display="none";  
            document.getElementById("strich").style.display="none";  
            document.getElementById("menu").style.display="none";  
          }  
        }
        

        Damit du die Elemente "bruecke", "strich" und "menu" nicht bei dem onmouseover- und onmouseout-Ereignis immer wieder im Elementbaum suchen lassen musst, besser in Variablen speichern:

        window.onload = function()  
        {  
          var bruecke = document.getElementById("bruecke");  
          var strich  = document.getElementById("strich");  
          var menu    = document.getElementById("menu");  
          
          document.getElementById("menubox").onmouseover = function()  
          {  
            bruecke.style.display="block";  
            strich.style.display="block";  
            menu.style.display="block";  
          }  
          document.getElementById("menubox").onmouseover = function()  
          {  
            bruecke.style.display="none";  
            strich.style.display="none";  
            menu.style.display="none";  
          }  
        }
        

        Das bringste im script-Element im head oder einer externen Datei unter und versteckst das Script mit conditional comment vor den Browsern, die das nicht benötigen.

        See ya up the road,
        Gunnar

        --
        “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
        1. Vielen Dank ihr beiden!!!

          Da habt ihr euch echt viel Mühe gemacht! :-))

          Mir leuchtet ein, was ihr sagt, und ich würde das auch gerne so machen ... leider funktioniert es aber nicht :-( Keine Ahnung warum, aber keine der beiden Varianten funktioniert.

          So habe ich das beispielsweise eingebaut:

          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

          <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">

          <head> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>stefan rohloff photography</title>

          <?php

          /* ************************************************* / / ****************  PHP Variablen  **************** / / ************************************************* */

          $galerie=$_GET["galerie"];                  /* Galerietyp /  if ($galerie=="") {$galerie="land";} $bild=$_GET["bild"];                                           / Bildnummer /  if ($bild=="") {$bild="1";} $hinweis=$_GET["hinweis"];                                      / Hinweis auf F11-Taste, 0 = noch nicht angezeigt, 1 = bereits angezeigt /  if ($hinweis=="") {$hinweis="0";} $imgsize=getimagesize($galerie.$bild.".jpg");                    / Bildgroesse, [0] = Breite, [1] = Hoehe / $imginfos=file("$galerie$bild.txt");                             / Bildinformationen, [0] = Bildbeschreibung, [1] = technische Daten / $anzahl=file("$galerie.txt");                                    / Anzahl der vorhandenen Bilder im aktuellen Galerietyp */ ?>

          <!-- ********************************************** --> <!-- ********************  CSS  ******************* --> <!-- ********************************************** -->

          <link href="galerie.css" rel="stylesheet" type="text/css" />

          <!-- ********************************************** --> <!-- ****************  Javascript  **************** --> <!-- ********************************************** -->

          <script type="text/javascript">     /* Funktion, die die Bildlaufleiste jeweils zum aktuellen Vorschaubild scrollt */ <?php echo"\tfunction scrollposition() {document.getElementById("bildleiste").scrollTop=".(($bild-2)106).";}\n"; / ($bild-2): aktuelles Bild in der Mitte, ($bild-1): aktuelles Bild oben */ ?> </script> <!--[if lt IE 7]> <script type="text/javascript"> window.onload = function() {   var bruecke = document.getElementById("bruecke");   var strich  = document.getElementById("strich");   var menu    = document.getElementById("menu");

          document.getElementById("menubox").onmouseover = function()   {     bruecke.style.display="block";     strich.style.display="block";     menu.style.display="block";   }   document.getElementById("menubox").onmouseover = function()   {     bruecke.style.display="none";     strich.style.display="none";     menu.style.display="none";   } } </script> <![endif]-->

          <style type="text/css"> <?php if (eregi("Win", $_SERVER['HTTP_USER_AGENT']))         {echo "#basis {font-size:0.812em;}\n";} else         {echo "#basis {font-size:1.082em;}\n";} ?> </style>

          </head>

          <body onload="scrollposition()">                              <!-- Hier wird die Javascript-Funktion aufgerufen -->

          <div id="basis">                                                 <!-- Umschliesst den gesamten Seiteninhalt, verhindert Scrollbalken im Konqueror -->

          . . .

          <!-- ********************************************** --> <!-- ******************  Menues  ****************** --> <!-- ********************************************** -->

          <div id="kopfzeile">                  <a href="" title="home"><h6>stefan rohloff photography &nbsp; - &nbsp; home</h6></a>          <div id="menubox">                   <h6>menu</h6>                          <span id="bruecke"></span>                          <span id="strich">test</span>                          <span id="menu">                                <a href="">home</a>                                  <a href="">lens tests</a>                                  <a href="">profil</a>                                  <a href="">guests</a>                                  <a href="">contact</a>                   </span>                  </div>  </div>  <div id="galeriemenu">      <?php                                           /* Der aktuelle Inhalt von $hinweis wird mit uebergeben */                  echo "<a href="galerie.php?galerie=landscape&amp;bild=1&amp;hinweis=$hinweis">landscape</a>\n\t\t";        echo "<a href="galerie.php?galerie=travel&amp;bild=1&amp;hinweis=$hinweis">travel</a>\n\t\t";          echo "<a href="galerie.php?galerie=detail&amp;bild=1&amp;hinweis=$hinweis">detail</a>\n";                  ?>  </div>

          </div>

          </body> </html>

          nochmal zum Vergleich, die alte funktionsfähige Version:

          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

          <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">

          <head> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>stefan rohloff photography</title>

          <?php

          /* ************************************************* / / ****************  PHP Variablen  **************** / / ************************************************* */

          $galerie=$_GET["galerie"];                  /* Galerietyp /  if ($galerie=="") {$galerie="land";} $bild=$_GET["bild"];                                           / Bildnummer /  if ($bild=="") {$bild="1";} $hinweis=$_GET["hinweis"];                                      / Hinweis auf F11-Taste, 0 = noch nicht angezeigt, 1 = bereits angezeigt /  if ($hinweis=="") {$hinweis="0";} $imgsize=getimagesize($galerie.$bild.".jpg");                    / Bildgroesse, [0] = Breite, [1] = Hoehe / $imginfos=file("$galerie$bild.txt");                             / Bildinformationen, [0] = Bildbeschreibung, [1] = technische Daten / $anzahl=file("$galerie.txt");                                    / Anzahl der vorhandenen Bilder im aktuellen Galerietyp */ ?>

          <!-- ********************************************** --> <!-- ********************  CSS  ******************* --> <!-- ********************************************** -->

          <link href="galerie.css" rel="stylesheet" type="text/css" />

          <!-- ********************************************** --> <!-- ****************  Javascript  **************** --> <!-- ********************************************** -->

          <script type="text/javascript">     /* Funktion, die die Bildlaufleiste jeweils zum aktuellen Vorschaubild scrollt */ <?php echo"\tfunction scrollposition() {document.getElementById("bildleiste").scrollTop=".(($bild-2)106).";}\n"; / ($bild-2): aktuelles Bild in der Mitte, ($bild-1): aktuelles Bild oben */ ?> </script> <!--[if lt IE 7]> <script type="text/javascript"> function einblenden() {  document.getElementById("bruecke").style.display="block";          document.getElementById("strich").style.display="block";          document.getElementById("menu").style.display="block";} function ausblenden() {         document.getElementById("bruecke").style.display="none";          document.getElementById("strich").style.display="none";  document.getElementById("menu").style.display="none";} </script> <![endif]-->

          <style type="text/css"> <?php if (eregi("Win", $_SERVER['HTTP_USER_AGENT']))         {echo "#basis {font-size:0.812em;}\n";} else         {echo "#basis {font-size:1.082em;}\n";} ?> </style>

          </head>

          <body onload="scrollposition()">                              <!-- Hier wird die Javascript-Funktion aufgerufen -->

          <div id="basis">                                                 <!-- Umschliesst den gesamten Seiteninhalt, verhindert Scrollbalken im Konqueror -->

          . . .

          <!-- ********************************************** --> <!-- ******************  Menues  ****************** --> <!-- ********************************************** -->

          <div id="kopfzeile">                  <a href="" title="home"><h6>stefan rohloff photography &nbsp; - &nbsp; home</h6></a>          <div id="menubox" onmouseover="einblenden()" onmouseout="ausblenden()">                   <h6>menu</h6>                          <span id="bruecke"></span>                          <span id="strich">test</span>                          <span id="menu">                                <a href="">home</a>                                  <a href="">lens tests</a>                                  <a href="">profil</a>                                  <a href="">guests</a>                                  <a href="">contact</a>                   </span>                  </div>  </div>  <div id="galeriemenu">      <?php                                           /* Der aktuelle Inhalt von $hinweis wird mit uebergeben */                  echo "<a href="galerie.php?galerie=landscape&amp;bild=1&amp;hinweis=$hinweis">landscape</a>\n\t\t";        echo "<a href="galerie.php?galerie=travel&amp;bild=1&amp;hinweis=$hinweis">travel</a>\n\t\t";          echo "<a href="galerie.php?galerie=detail&amp;bild=1&amp;hinweis=$hinweis">detail</a>\n";                  ?>  </div>

          </div>

          </body> </html>

          Stefan

          1. Hallo Stefan Rohloff,

            du hast noch ein onload im Body-Tag drin, welches Dein erstes überschreiben sollte. Du könntest abfragen, ob bereits ein onload vorhanden ist:

              
            var oldonload=null;  
             if (typeof(window.onload) != "undefined" ){  
              oldonload=window.onload;  
             }  
                window.onload = function() { if(oldonload != null) {oldonload();} scrollposition(); };  
            
            

            und dafür dann auf das onload im Body verzichten.

            Micha

            Mit freundlichem Gruß
            Micha

            --
            LeagueEditor JavaScript :: simple Ligaverwaltung auf der Basis von JavaScript || JS Tetris :: für zwischendurch
            1. Danke!

              Habe einfach mal den anderen Javascript-Teil komplett herausgenommen (auch den angesprochenen onload im <body>). Leider funktioniert es immer noch nicht. Es geschieht eifach nichts, wenn ich mit der Maus über die entsprechende Stelle fahre ...

              Liebe Grüße, Stefan

              Jetzt sah es also so aus:

              <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
              "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

              <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">

              <head>
              <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />
              <meta http-equiv="Content-Script-Type" content="text/javascript" />
              <title>stefan rohloff photography</title>

              <?php

              /* ************************************************* */
              /* ****************  PHP Variablen  **************** */
              /* ************************************************* */

              $galerie=$_GET["galerie"];                  /* Galerietyp */
               if ($galerie=="") {$galerie="land";}
              $bild=$_GET["bild"];                                           /* Bildnummer */
               if ($bild=="") {$bild="1";}
              $hinweis=$_GET["hinweis"];                                      /* Hinweis auf F11-Taste, 0 = noch nicht angezeigt, 1 = bereits angezeigt */
               if ($hinweis=="") {$hinweis="0";}
              $imgsize=getimagesize($galerie.$bild.".jpg");                    /* Bildgroesse, [0] = Breite, [1] = Hoehe */
              $imginfos=file("$galerie$bild.txt");                             /* Bildinformationen, [0] = Bildbeschreibung, [1] = technische Daten */
              $anzahl=file("$galerie.txt");                                    /* Anzahl der vorhandenen Bilder im aktuellen Galerietyp */
              ?>

              <!-- ********************************************** -->
              <!-- ********************  CSS  ******************* -->
              <!-- ********************************************** -->

              <link href="galerie.css" rel="stylesheet" type="text/css" />

              <!-- ********************************************** -->
              <!-- ****************  Javascript  **************** -->
              <!-- ********************************************** -->

              <!--[if lt IE 7]>
              <script type="text/javascript">
              window.onload = function()
              {
                var bruecke = document.getElementById("bruecke");
                var strich  = document.getElementById("strich");
                var menu    = document.getElementById("menu");

              document.getElementById("menubox").onmouseover = function()
                {
                  bruecke.style.display="block";
                  strich.style.display="block";
                  menu.style.display="block";
                }
                document.getElementById("menubox").onmouseover = function()
                {
                  bruecke.style.display="none";
                  strich.style.display="none";
                  menu.style.display="none";
                }
              }
              </script>
              <![endif]-->

              <style type="text/css">
              <?php
              if (eregi("Win", $_SERVER['HTTP_USER_AGENT']))
                      {echo "#basis {font-size:0.812em;}\n";}
              else
                      {echo "#basis {font-size:1.082em;}\n";}
              ?>
              </style>

              </head>

              <body>

              <div id="basis">                                                 <!-- Umschliesst den gesamten Seiteninhalt, verhindert Scrollbalken im Konqueror -->

              .
              .
              .
              .

              <!-- ********************************************** -->
              <!-- ******************  Menues  ****************** -->
              <!-- ********************************************** -->

              <div id="kopfzeile">
                               <a href="" title="home"><h6>stefan rohloff photography &nbsp; - &nbsp; home</h6></a>
                       <div id="menubox">
                                <h6>menu</h6>
                                       <span id="bruecke"></span>
                                       <span id="strich">test</span>
                                       <span id="menu">
                                             <a href="">home</a>
                                               <a href="">lens tests</a>
                                               <a href="">profil</a>
                                               <a href="">guests</a>
                                               <a href="">contact</a>
                                </span>
                               </div>
               </div>
               <div id="galeriemenu">
                   <?php                                           /* Der aktuelle Inhalt von $hinweis wird mit uebergeben */
                               echo "<a href="galerie.php?galerie=landscape&amp;bild=1&amp;hinweis=$hinweis">landscape</a>\n\t\t";
                     echo "<a href="galerie.php?galerie=travel&amp;bild=1&amp;hinweis=$hinweis">travel</a>\n\t\t";
                       echo "<a href="galerie.php?galerie=detail&amp;bild=1&amp;hinweis=$hinweis">detail</a>\n";
                               ?>
               </div>

              .
              .
              .
              .

              </div>

              </body>
              </html>

              1. Hallo Stefan Rohloff,

                Du hast zweimal
                document.getElementById("menubox").onmouseover = ... drin. Somit überschreibst Du die Methode direkt am Anfang. Ein onmouseout sollte da afaik helfen.

                Kannst Du zukünftig bitte Deinen Code auf das wesentliche reduzieren, gerade der unwichtige PHP-Teil stört?

                Ich habe mal im FF getestet, in dem ich die Kommentare entfernt habe, der kommt problemlos damit klar. Mit Kommentar wird das Menü auch in meinem IE6 ausgeblendet.

                Mit freundlichem Gruß
                Micha

                --
                LeagueEditor JavaScript :: simple Ligaverwaltung auf der Basis von JavaScript || JS Tetris :: für zwischendurch
                1. Oh Mann, vielen Dank, das hätte ich ja auch wirklich selber finden können! Sorry ;-)

                  Jetzt klappt es endlich, ich war schon verzweifelt ...

                  Kannst Du zukünftig bitte Deinen Code auf das wesentliche reduzieren, gerade der unwichtige PHP-Teil stört?

                  Ja, werde ich ... hatte auch jetzt schon überlegt, was ich weglassen könnte ... hatte aber keine Ahnung, womit der Fehler zusammenhängen könnte, dashalb hab ich (zu) viel dringelassen ... aber sonst hätte ich vermutlich das onload im <body> auch weggelassen, darauf hätte ich nicht getippt ...

                  Wie man nun erreicht, dass die neue Funktion bei window:onload nun nicht die alte überschreibt, hab ich wenigstens noch selber herausgefunden :-)

                  Falls jemand hier mal nachliest, so funktioniert es jetzt (im <body> steht nirgends mehr Javascript):

                  <script type="text/javascript">
                  function scrollposition()
                  {
                    document.getElementById("bildleiste").scrollTop=212;
                  }
                  window.onload = scrollposition;
                  </script>

                  <!--[if lt IE 7]>
                  <script type="text/javascript">
                  function menu()
                  {
                    var bruecke = document.getElementById("bruecke");
                    var strich  = document.getElementById("strich");
                    var menu    = document.getElementById("menu");

                  document.getElementById("menubox").onmouseover = function()
                    {
                      bruecke.style.display="block";
                      strich.style.display="block";
                      menu.style.display="block";
                    }
                    document.getElementById("menubox").onmouseout = function()
                    {
                      bruecke.style.display="none";
                      strich.style.display="none";
                      menu.style.display="none";
                    }
                  }
                  window.onload = function() {menu(); scrollposition();}
                  </script>
                  <![endif]-->

        2. Hallo,

          window.onload = function()

          {
            var bruecke = document.getElementById("bruecke");
            var strich  = document.getElementById("strich");
            var menu    = document.getElementById("menu");

          document.getElementById("menubox").onmouseover = function()
            {
              bruecke.style.display="block";
              strich.style.display="block";
              menu.style.display="block";
            }
            document.getElementById("menubox").onmouseover = function()
            {
              bruecke.style.display="none";
              strich.style.display="none";
              menu.style.display="none";
            }
          }

            
          Kleiner Hinweis:  
            
          Expression Statements werden in JavaScript mit einem Semikolon beendet. Das ist optional, weil sie [automatisch eingefügt](http://bclary.com/log/2004/11/07/#a-7.9) werden, gehört aber zum guten Stil, um eindeutigen Code zu schreiben.  
            
          Genauso wie man hinter  
          `bruecke.style.display = "block";`{:.language-javascript}  
          ein Semikolon notiert, sollte man es auch hinter  
          ~~~javascript
          window.onload = function () {  
             ...  
          };
          

          und so weiter. Beides sind Expression Statements mit einem Assignment Operator, dass da nun beim letzteren eine Function Expression enthalten ist, ändert daran nichts.

          Generell treten bei solchen Closures potenziell Memory-Leaks im IE 6 auf. Hier gibts zwar keine kreisförmige Referenzkette, aber man müsste schauen, ob Elementknoten → onmouseover → Event-Handler-Closure → andere Elementknoten Probleme macht.

          Mathias

    2. hi,

      <script type="text/javascript">
      <!--[if IE]>

      HTML-Kommentare haben in JavaScript ncihts zu suchen. Die conditional comments gehören außerhalb des script-Elements.

      Dafür kennt der IE conditional compilation in Javascript - damit könnte man es auch so machen, dass die Funktionsinhalte mit einem Javascript-Kommentar vor den anderen Browsern versteckt werden.

      gruß,
      wahsaga

      --
      /voodoo.css:
      #GeorgeWBush { position:absolute; bottom:-6ft; }
  2. Hallo,

    Hallo, ich habe mir als Ersatz für div:hover für den IE folgendes kleine Javascript gemacht:

    <script type="text/javascript">
    <!--[if IE]>
    function einblenden() {
    document.getElementById("bruecke").style.display="block";
    document.getElementById("strich").style.display="block";
    document.getElementById("menu").style.display="block";}
    function ausblenden() {
    document.getElementById("bruecke").style.display="none";
    document.getElementById("strich").style.display="none";
    document.getElementById("menu").style.display="none";}
    <![endif]-->
    </script>

    und weiter unten dann:

    <div id=“menubox“ onmouseover="einblenden()" onmouseout="ausblenden()">

    Das ganze funktioniert auch gut, allerdings rufen ja so alle Browser außer dem IE Funktionen auf, die gar nicht existieren! Ich weiß nicht, ob das ein Problem ist?!

    Ja, ich würde es als ein Problem ansehen. Schon das Notieren der Eventhandler-Attribute im HTML ist ja für standardkonforme Browser gar nicht nötig. Ich würde das JavaScript komplett vom HTML abkapseln. Die Eventhandler kannst Du auch mit purem JavaScript definieren. Etwa so:

    <!--[if IE]>

    <script type="text/javascript">
    function einblenden() {
    document.getElementById("bruecke").style.display="block";
    document.getElementById("strich").style.display="block";
    document.getElementById("menu").style.display="block";}
    function ausblenden() {
    document.getElementById("bruecke").style.display="none";
    document.getElementById("strich").style.display="none";
    document.getElementById("menu").style.display="none";}

    window.onload = function() {
         if (document.getElementById) {
          var myDIV = document.getElementById("menubox");
          myDIV.onmouseover = einblenden;
          myDIV.onmouseout = ausblenden;
         }
       }

    </script>

    <![endif]-->

    und weiter unten dann:

    <div id="menubox">

    So hast Du im HTML erst gar keine Attribute, die _nur_ der IE braucht.

    viele Grüße

    Axel

    1. Hello out there!

      Hm, da nimmt man sich mal Zeit, etwas ein bisschen ausfürlicher zu erklären, schwupps – war ein anderer schneller.

      See ya up the road,
      Gunnar

      --
      “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
      1. Hallo Gunnar,

        Hm, da nimmt man sich mal Zeit, etwas ein bisschen ausfürlicher zu erklären, schwupps – war ein anderer schneller.

        *g* Dafür hättest Du jetzt aber wieder Ingrid spielen, und in Deinem Posting drei Mal onmouseover durch onmouseout ersetzen müssen. So hast Du nur Verwirrung gestiftet ;-).

        viele Grüße

        Ax*duck*el

        1. Hello out there!

          *g* Dafür hättest Du jetzt aber wieder Ingrid spielen, […]

          Ich _spiele_ nicht Ingrid, ich b... – aber psst.

          See ya up the road,
          Gunnar

          --
          “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
  3. Hallo Stefan,

    <script type="text/javascript">
    <!--[if IE]>

    vielleicht sind die verschiedenen Browserweichen, wie sie hier zum
    Test von "mehrfachen IE Installationen" eingesetzt und gezeigt werden,
    noch interessant für Dich.
    Weichen direkt in JavaScript oder die conditional compilation können
    dabei die Sache übersichtlicher machen, ausserdem ist es einfacher
    (nur) ein externes Script zu verwenden.

    Grüsse
    Cyx23

    1. Danke!

      Stefan