chris3007: Problem mit Javascript in div-tag

Hallo zusammen,

ich habe ein kleines Problem, eine Javascript-Funktion aufzurufen.
Das Javascript wird im head aufgerufen.

  • im IE funktioniert sie,
  • im Firefox NICHT.

Wenn ich die ganzen div-tags rausnehmen, dann wird die Funktion richtig dargestellt. Es handelt sich übrigens um ein Rollover-Effekt.

Es scheint im firefox also ein Problem zu sein, in div-tags, die über die .css definiert sind, Javascript laufen zu lassen.

Kennt jemand dieses Problem?

Gruß
Chris

  1. @@chris3007:

    nuqneH

    • im IE funktioniert sie,
    • im Firefox NICHT.

    „Funktioniert nicht“ funktioniert nicht.

    Kennt jemand dieses Problem?

    Ja, es taucht hier öfter auf: Missachtung der Tips für Fragende in der Charta.

    Qapla'

    --
    Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
    1. Ok. Dann hier nochmal genauer beschrieben:

      Hier mein Seitenquelltext zur folgender Seite: http://www.pronature-holistic.de/?action=hunde

        
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
      <html>  
      	<head>  
      		<link href="reset.css" rel="stylesheet" type="text/css">  
      		<link href="stylesheet.css" rel="stylesheet" type="text/css">  
      		<script type="text/javascript" src="functions.js"></script>  
        
      		<title>Pronature Holistic</title>  
      	</head>  
        
      	<body>  
      	<div id="ie6-container-wrap>  
      		<div id="header-wrap">  
      	<div id="header-container">  
      		<div id="header">  
      			<div id="header_logo"><a href="./index.php"><img src="images/logo.png" border="0" alt="Pronature Holistic" /></a></div>  
        
      			<div id="header_sub_nav">  
      				<ul>  
      					<li><a href="./index.php">Home</a></li>  
        
      					<li><a href="">Kontakt</a></li>  
      					<li class="last"><a href="">Impressum</a></li>  
      				</ul>  
      				<p>  
      					<img src="images/logo2.png" alt="Simply natural!" />  
      				</p>  
      			</div>  
      			<div id="main_header">&nbsp;</div>  
        
      			<ul id="main_nav">  
      				<li id="nav_1"><a href="?action=home"><span class="oneline">Home</span></a></li>  
      				<li id="nav_2"><a href="?action=hunde"><span class="oneline">Hunde</span></a></li>  
      				<li id="nav_3"><a href="?action=katzen"><span class="oneline">Katzen</span></a></li>  
      				<li id="nav_4"><a href="?action=inhalte"><span class="oneline">Inhalte</span></a></li>  
      				<li id="nav_5"><a href="?action=shop"><span class="oneline">Onlineshop</span></a></li>  
        
      				<li id="nav_6"><a href="?action=handel"><span class="oneline">F&uuml;r H&auml;ndler</span></a></li>  
      			</ul>  
      		</div>  
      	</div>  
      </div>  
      		 <div id="hunde-katze">  
       	<div id="uebergang">  
        
       		<table height="464" align="center" valign="bottom" width="100%">  
       			<tr>  
       				<td width="20%" align="center" valign="bottom">  
      					<img src="images/hund_01.png">  
       				</td>  
       				<td width="20%" align="center" valign="bottom">  
      					<img src="images/hund_02.png">  
       				</td>  
       				<td width="20%" align="center" valign="bottom">  
        
      					<img src="images/hund_03.png">  
       				</td>  
       				<td width="20%" align="center" valign="bottom">  
      					<img src="images/hund_04.png">  
       				</td>  
       				<td width="20%" align="center" valign="bottom">  
       					<p align="center"><a href="index.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Senior','','images/hund_05_big.png',1)"><img src="images/hund_05.png" name="Senior" border="0" alt="Senior"></a>  
      							<br>Senior</p>  
        
       				</td>  
       			</tr>  
       		</table>  
       		  
       	</div>  
       </div>  
      	</div>  
      	</body>  
      </html>  
        
      
      

      Hier ein Link zur eingebundenen Javascript-Funktion:
      Javascript-Funktion

      Hier ein Link zur CSS:
      Stylesheet

      Das ganz rechte Bild in der Seite sollte einen Rollover-Effekt haben. Im IE wird der auch dargestellt.
      Im Firefox wird der Rollover nicht dargestellt, nicht einmal der Link funktioniert. Ich vermute, dass die div-tags die im head eingebundene Funktion ignorieren.

      Kann mir da jemand helfen?

      Danke und Gruß
      Chris

      1. Lieber chris3007,

        http://www.pronature-holistic.de/?action=hunde
        [...]
        Kann mir da jemand helfen?

        bereinige zuerst die syntaktischen Fehler (im FF sieht man's mit Syntax-Highlighting sehr gut)! Dann darfst Du wieder mit Deiner Frage kommen.

        Liebe Grüße,

        Felix Riesterer.

        --
        ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)
        1. Hallo Felix,

          die syntaktischen Fehler sollten behoben sein. Kann jetzt eine Antwort auf meine eigentlich Frage erfolgen?

          1. Ganz etwas anders: Du könntest allgemein auf JavaScript verzichten und CSS verwenden http://www.alistapart.com/d/sprites/ala-blobs2.html. Für diesen simplen Effekt ist imho kein JavaScript erforderlich.

          2. Mahlzeit chris3007,

            die syntaktischen Fehler sollten behoben sein.

            Aha. Und wie sieht der Quellcode *jetzt* aus? Mit dem Quellcode der von Dir verlinkten URL hat er nämlich nur teilweise Ähnlichkeit.

            Außerdem ist zumindest letzterer immer noch fehlerhaft - um genau zu sein enthält er "6 Errors, 4 warning(s)".

            Kann jetzt eine Antwort auf meine eigentlich Frage erfolgen?

            Nein. Nicht solange Du es Deinen Lesern (und damit den potentiellen Helfern) so schwer machst, Dir zu helfen.

            MfG,
            EKKi

            --
            sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|
            1. Danke für die weiteren Hinweise auf Fehler im Code.

              Hier die aktuellen Versionen:
              http://www.pronature-holistic.de/?action=hunde

              Die css-Datei:
              http://www.petsnature-holistic.de/stylesheet.css

              Und die Functions.js:
              http://www.petsnature-holistic.de/functions.js

              Es geht mir also um diesen Codeteil:

                
               <div id="hunde-katze">  
               	<div id="uebergang">  
                
               		<table style="height:464px;" align="center" width="100%">  
               			<tr>  
               				<td width="20%" align="center" valign="bottom">  
              					<img src="images/hund_01.png" alt="Pronature">  
               				</td>  
               				<td width="20%" align="center" valign="bottom">  
              					<img src="images/hund_02.png" alt="Pronature">  
               				</td>  
               				<td width="20%" align="center" valign="bottom">  
              					<img src="images/hund_03.png" alt="Pronature">  
               				</td>  
               				<td width="20%" align="center" valign="bottom">  
              					<img src="images/hund_04.png" alt="Pronature">  
               				</td>  
               				<td width="20%" align="center" valign="bottom">  
               					<p align="center"><a href="index.php" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Senior','','images/hund_05_big.png',1)"><img src="images/hund_05.png" name="Senior" border="0" alt="Senior"></a>  
              							<br>Senior</p>  
               				</td>  
               			</tr>  
               		</table>  
               		  
               	</div>  
               </div>  
              
              

              In diesem Teil wird die Rollover-Funktion aufgerufen. Im IE wird sie dargestellt, im Firefix nicht. Im FF wird nicht einmal der Link dargestellt.
              Meine Frage ist also, wie ich das Script hier richtig einbinde.

              Danke im Voraus.

              1. In diesem Teil wird die Rollover-Funktion aufgerufen. Im IE wird sie dargestellt, im Firefix nicht. Im FF wird nicht einmal der Link dargestellt.

                Also bei mir funkttioniert es im Firefox, bis auf den Fehler in der CSS Datei, den hast du aber auch gesehen, oder kennst du die Fehlerkonsole nicht?

                Struppi.

                1. Danke Struppi,
                  der Fehler lag jetzt am Ende darin, dass ein z-index falsch gesetzt war.
                  Das Problem hat sich daher erledigt.

                  Vielen Dank an alle (auch bzgl. der syntax-geschichten)
                  Gruß
                  Chris

    2. Ja, es taucht hier öfter auf: Missachtung der Tips für Fragende in der Charta.

      Auch die Verweigerung der neuen Rechtschreibung tritt öfter auf :)

  2. Hallo,

    Kennt jemand dieses Problem?

    mach mal bitte ein kleines Gedankenexperiment:

    * Versuche, alles zu vergessen, was du über Aufbau und Struktur deine Website weißt.
     * Lies dann dein Posting nochmal aufmerksam durch.

    Würdest du verstehen, wovon der Typ redet? - Also ich nicht.

    Bitte versuche also, dein Anliegen nochmal so zu beschreiben, dass ein Uneingeweihter auch eine Chance hat, es zu verstehen. Ein paar relevante Codeausschnitte könnten dabei helfen, noch besser ein Live-Beispiel online, das sich jeder selbst ansehen kann.
    Und bitte präzisiere "funktioniert nicht". Dazu gehört immer die Angabe, *was* du erwartest, und *was* du stattdessen beobachtest (auch Fehlermeldungen oder so).

    Good luck,
     Martin

    --
    Wer mit dem Finger droht, sollte ihn am Abzug haben, und nicht in der Nase.