Hover Probleme mit JavaSkript in Joomla, sehr seltsam??

[Gutschy]

Hallo Leute,

bastel gerade an einen Webshop und habe dafür ein einfaches Sprungmenue mit Ankern für eine lange Liste gemacht. Aber der Hover Effekt macht mich Irre.

Hier mal der Link:
http://www.pizza-blitz-amigo.de/7
Ist ein Pizza Shop, aber die 7 ist ein Testsystem und die Bestellungen gehen ins Nirvana, also ruhig testen.

Bitte auf Pizza Klicken und über die grüne Fläche mit den Preisen fahren.

Hier mal das Menue und danach hänge ich noch die CSS an, der Teil der mit dem Hover Effekt ist ganz oben angesiedelt:

<table class="main">
 <tr>
  <td>      
  	<table class="inner">
       <tr>
        
        <td class="title"><a class="menue" href="#pos1">Pizza Magharita</a></td>
        <td class="p1">3,00&euro;</td>
        <td class="p2">4,00&euro;</td>
        
       </tr>
      </table>
      </td>
  <td>      
  	<table class="inner">
       <tr>
        <td class="title"><a class="menue" href="#pos10">Pizza Curry</a></td>
        <td class="p1">5,00&euro;</td>
        <td class="p2">6,00&euro;</td>
       </tr>
      </table>
      </td>
  <td>      
  	<table class="inner">
       <tr>
        <td class="title"><a class="menue" href="#pos19">Salami Spezial</a></td>
        <td class="p1">3,00&euro;</td>
        <td class="p2">4,00&euro;</td>
       </tr>
      </table>
      </td>

usw....

Hier dann die CSS, wild gekürzt, ich habe versucht alles drinnzulassen was irgendwie nach hovern aussieht. Die Tabellen CSS bezieht sich auf die Tabelle mit den Pizzen.

a.meue:link { color: #FFFFFF; text-decoration:none; }
a.menue:visited { color:#FFFF00; text-decoration:none; }
a.menue:focus { color:red; text-decoration:underline; }
a.menue:hover { color:#669933; text-decoration:none; background-color: #FFFFFF; }
a.menue:active { color:#FFFFFF; text-decoration:none; }


	table.weg_pasta {
	z-index: 501;
	position: relative;
	top: -1785px;
	left: -20px;
  #background-color: #FFFFFF;
	border: 0px;
	width: 10px;

}

td.weg_zell_pasta {
	#background-color: #51CA57;
	text-align: right;
	width: 1px;
	height: 75px;
	padding: 0;
	border: 0px;
}


	table.weg {
	z-index: 501;
	position: relative;
	top: -5405px;
	left: -20px;
  #background-color: #FFFFFF;
	border: 0px;
	width: 10px;

}

td.weg_zell {
	#background-color: #669933;
	text-align: right;
	width: 40px;
	height: 125px;
	padding: 0 10px 0 2px;
	border: 0px;
}
	
	 
table.main {
	  background-color: #669933;
		border: 0px;
		padding: 2px 0 2px 0;
		z-index: 200;
	  position: relative;
	  top: -1px;
	  left: 220px;
	  font-family: Arial;
	  border-spacing: 0px;

	}
	
table.inner {
			color: #FFFFFF;
		  font-size: 12px;
		  margin: 0px;
		  padding: 0px;
		  border-spacing: 0px;
 }
	
td.title {
	width: 98px;
	margin: 0px;
	padding: 0px;
	border: 0;
}

td.p1 {
	text-align: right;
	width: 39px;
	margin: 0px;
	padding: 0 0px 0 2px;
	border : 0px;
}

td.p2 {
	text-align: right;
	width: 38px;
	margin: 0px;
	padding: 0 6px 0 2px;
	border: 0px;
}

td.titlepasta {
	width: 149px;
	margin: 0px;
	padding: 0px;
	border: 0;
}

td.p1_pasta {
	text-align: right;
	width: 30px;
	margin: 0px;
	padding: 0 3px 0 2px;
	border : 0px;
}




a:link, a:visited {

        text-decoration: underline;

        font-weight: normal;

        color: #669933;

}



a:hover {

        text-decoration: none;

        font-weight: normal;

        color: #669933;

}



input.button, .validate  {

        color: #669933;

        border: 1px solid #669933;

        font-size: 10px;

        background: #FFF;

}



input.button:hover, .validate:hover  {



}



p {

        margin-top: 0;

        margin-bottom: 5px;

        text-align: justify;

}



.inputbox {

        border: 1px solid #669933;

        color: #669933;

}

.inputbox:hover {



}


#logo a, #logo a:link, #logo a:hover {


        padding: 0;

        margin: 0;

        letter-spacing: 1px;

        color: #669933;

        background: transparent;

        text-decoration: none;

        outline: none;

}


#pillmenu li:hover {



}



#pillmenu li a#active_menu-nav {

        text-decoration: underline;

}



#pillmenu li a {

        font-family: Verdana, sans-serif;

        font-size: 12px;

        float: left;

        display: block;

        line-height: normal;

        padding: 8px 12px 8px 12px;

        color: #FFF;

        text-decoration: none;

}



#pillmenu li a:hover {

        background: #FFF;

        color: #669933;

}


/* menu links */

a.mainlevel:link, a.mainlevel:visited {

        padding-left: 5px;

}



a.mainlevel:hover {



}



a.sgfooter:link, a.sgfooter:visited {

        color: #669933;

        font-family: Verdana, Arial, Tahoma, sans-serif;

        text-decoration: none;

}

a.sgfooter:hover {

        color: #669933;

        font-family: Verdana, Arial, Tahoma, sans-serif;

        text-decoration: none;

}

#sgf {

        font-size: 11px;

        text-align: center;

        width: 100%;

        margin: 0 auto;

        color: #669933;

        font-family: Verdana, Arial, Tahoma, sans-serif;

}

.sgf {

        text-align: right;

        font-size: 11px;

        font-family: Verdana, Arial, Tahoma, sans-serif;

        color: #669933;

        text-decoration: none;

}

.sgf1 {

        font-size: 11px;

        font-family: Verdana, Arial, Tahoma, sans-serif;

        color: #669933;

        text-align: left;

}



a.sglink:link, a.sglink:visited {

        color: #669933;

        font-size: 11px;

        font-family: Verdana, Arial, Tahoma, sans-serif;

        text-decoration: none;

}

a.sglink:hover {

        color: #669933;

        font-family: Verdana, Arial, Tahoma, sans-serif;

        text-decoration: none;

        }

Die geklickten Pizzen bleiben stehen, aber irgendwie auch nicht immer. Und die Links des Warenkorbes wird irgendwie durch das Menue verdeckt, zumindest laut FireBug. Da habe ich mich aber noch mit beschäftigt.

Wenn die Warenkorb Liste ganz lang gemacht wird, dann kann man auch die Links erreichen. Löscht man dann den Warenkorb, dann verändern sich auch wieder die Links der Pizzen.

Wer sich wirklich gnädigerweise da reinknien möchte, ich hänge die CSS mal dran.

Hoffe jemand weiß rat.

Gruss,

Gutschy

[wildmieze]

... spontan sehe ich bei deinem CSS-Ausschnitt einen Tippfehler, direkt in der ersten Zeile: "a.meue:link" - da fehlt ein "n". Vielleicht isses das schon ..


EDIT und Off-Topic: bei den Extras für die Pizzen fehlt definitiv noch Crème fraîche

[Gutschy]

Ach ja,

wenn doch alles so einfach wäre.....

@wildmieze, fühle dich von mir virtuell gedrückt.

Und das mit dem Crème fraîche gebe ich mal weiter *g*