Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag30.03.2012 um 14:13 (UTC)    
Titel: Design RED: Beschreibung für jeden einzelnen Navi-Punkt?

Hallo!

Habe eine simple aber vielleicht nicht umsetzbare Frage: Gibt es eine Möglichkeit, für jeden Button in der Navigation eine Beschreibung einzufügen?
Dachte mir das so, wenn man mit der Maus rüberfährt...BEISPIEL:

Wenn ich mit der Maus über den Button 'Umfragen' fahre, dann soll nur während dem rüberfahren (hover) rechts daneben ein div oder auch span block aufgehen mit einer kurzen Beschreibung, wie z.B. 'Hier findest du unsere aktuellen Umfragen'.

1.) Geht sowas und
2.) wie? mit JS oder CSS?


Hoffe auf Hilfe Wink
______________
Beitrag30.03.2012 um 14:50 (UTC)    
Titel:

einfach so <a href="http://.htm" title="Beispiel">Link</a>
d.h. wenn du das title="" einbauen kannst. Hab mir deine Navi jetzt nicht angeschaut Smile
______________
Gruß Pexxi
Beitrag30.03.2012 um 15:32 (UTC)    
Titel:

pexxi hat Folgendes geschrieben:
einfach so <a href="http://.htm" title="Beispiel">Link</a>
d.h. wenn du das title="" einbauen kannst. Hab mir deine Navi jetzt nicht angeschaut Smile


nein nein! das ist ja einfach nur ein title-tag vom link.

1.) benutze ich das design red und 2.) will ich, dass beim überfahren ein extra div- oder span-block aufgeht evtl. sogar noch mit nem kleinen bild drin Wink
______________
Beitrag30.03.2012 um 18:34 (UTC)    
Titel:

Hallo,

per CSS kannst du Pseudoelemente erzeugen, die für deine Zwecke ausreichen sollten.

Als erstes positionierst du alle Links der Klasse rednav relative. Andiesen wird das jeweilige Pseudoelement später ausgerichtet:
Zitat:
a.rednav{
position:relative;
}


Dann erzeugst du das Pseudoelement mit der Pseudoklasse after, für alle Links der Klasse rednav, mit der Pseudoklasse hover:
Zitat:
a.rednav:hover:after


Dieses Pseudoelement wird jetzt absolute Positioniert. Da Die Links relative positioniert sind, richtet sich das Pseudoelement an diesen aus:
Zitat:
a.rednav:hover:after{
position:absolute;
top:XXpx;
left:XXpx;
z-index:99;
}

abstand von oben
abstand von links

Hier kannst du auch weitere Formatierung, wie Hintergrund, Schriftfarbe...definieren.

Um für jeden Menüeintrag einen eigenen Text zu schreiben, kann man die Links aufgrund des href Attributs selektieren. Mit der Content Eigenschaf, wird dann der Text in das Pseudoelement geschrieben.

Verlinkt der Link auf Seite-1.htm sieht das z.B. wie folgt aus:
Zitat:
a.rednav[href="/Seite-1.htm"]:hover:after{
content:"Hallo, ich bin Seite 1!";
}

______________
mfg
o-4-n

"If you’re incompetent, you can’t know you’re incompetent." - [David Dunning]

*** Die Suchfunktion ist KEINE tödliche Krankheit! ***

Eventplanung, Equipment, Zeltverleih, Catering
Beitrag01.04.2012 um 12:14 (UTC)    
Titel:

Danke dir o-4-n! klappt Wink
______________
Beitrag01.04.2012 um 16:53 (UTC)    
Titel:

Dann danke für die Rückmeldung.

- CLOSED -
______________
mfg
o-4-n

"If you’re incompetent, you can’t know you’re incompetent." - [David Dunning]

*** Die Suchfunktion ist KEINE tödliche Krankheit! ***

Eventplanung, Equipment, Zeltverleih, Catering


Zuletzt bearbeitet von o-4-n am 01.04.2012, 22:42, insgesamt 2-mal bearbeitet
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de