Text unsichtbar machen bei hover wieder sichtbar

[Benno]

Hi Leute,

hab ein Problem das ich euch jetzt einfach mal schildere!
Hab mit Joomla eine HP für nen Kumpel gebastelt! www.derstoff.com/index.php

er will oben als menü eine bestimmte schriftart haben!
Da die schriftart bei den usern ja nicht angezeigt wird sonder dann nur ne standartschriftart hab ich des einfach als hintergrundbild eingefügt.
Dann einfach das Richtige Menü darüber gesetzt und angepasst
Das Problem ist jetzt dass die Menüschrift erstmal nicht sichtbar sein soll, erst wenn man darüber geht!
Hier mal ein kleiner auszug aus der css datei
#navheader li {
 z-index: 3;
 position: relative;
 float: left;
 padding: 0;
 margin: 0;
 list-style: none;
}
#navheader li a {
 display: block;
 font-size: 12px;
 font-weight: bold;
 padding: 0 14px;
 text-decoration: none;
 color: #FFFFFF;
 visibility:hide;}

#navheader li a:hover {
 visibility:hide;
 color: #000000;
 }

#navheader li.active {
 z-index: 1;
 height: 17px;
 border-bottom: 4px solid #000000;
}
#navheader {
 z-index: 2;
 position: absolute;
 height: 20px;
 margin-top : 7px;
}

#slider {
 z-index: -1;
 position: absolute;
 height: 20px;
 background-color  : #FFFFFF;
 border-bottom   : 4px solid #FFFFFF;

}

hab schon vergeblich mit visibility gespielt aber leider ohne Erfolg.
wenn ich li A auf hidden setzt und hover auf hide wird leider nur der scrollslider angezeigt... und mit display: none wird garnichts mehr angezeigt!

Hat irgend jemand ne andere Idee oder weiß wie ich das Problem lösen kann? Wär echt saucool

Greetz

[Stahli]

Hi,

er will oben als menü eine bestimmte schriftart haben!
Da die schriftart bei den usern ja nicht angezeigt wird sonder dann nur ne standartschriftart hab ich des einfach als hintergrundbild eingefügt.

..aus dem Auszug deiner CSS-Datei nicht ersichtlich.

Dann einfach das Richtige Menü darüber gesetzt und angepasst
Das Problem ist jetzt dass die Menüschrift erstmal nicht sichtbar sein soll, erst wenn man darüber geht!

Also wenn ich es richtig verstehe: Zuerst sollen die Menüpunkte in kleiner Standartschrift angezeigt werden, wenn man die Maus darüber bewegt soll die pompöse Schrift erstrahlen.

Ich vermute mal du benutzt _ein_ Hintergrundbild für die _fünf_ Menüpunkte. Warum? Teil jedem li-Tag ein eigenes Hintergrundbild zu (mit background-image) und blende es bei :hover wieder aus (mit background-image).
Um zu verhindern, dass Standartschrift und superschicke Designerschrift aufeinmal angezeigt werden, müsstest du, denk ich, unelegante Tricks anwenden; Schriftgröße auf 0px setzen oä. Denk dabei an deine User, die sich keine Bilder anzeigen lassen.
Fazit: Lass es bleiben, benutz eine Standartschriftart oder benutze img-Tags, wo du dann zwei verschiedene Hintergrundbilder hast und die wechselst (nicht alt-Attribut vergessen).

Sonst ohne viel Aufwand versuch dies:

  
#navheader li:hover{  
   visibility:hide;  
}  

Funktioniert aber nicht im IE, da muss JavaScript helfen.

Tipp für spätere Postings: Beschreibe verständlicher was du erreichen willst.