|
|||
Ausklappbare "Box" wenn man über Link fährt?
Hallo zusammen,
ich habe einen Container, der ein Hintergrundbild beinhaltet.. Nun möchte ich einen Link in diesen tun (wie das geht weiß ich wohl..) - es soll eine weitere Auswahlmöglichkeit (die auch Links beinhaltet) nach oben weg erscheinen, wenn man drüberfährt... Kann mir da jemand helfen? Ich habe zur Verdeutlichung zwei Grafiken erstellt: Den transparenten Hintergrund würde ich als .png machen... Mich würde nur interessieren, wie ich die Links erscheinen lassen kann..... Ich hoffe, ich habe ausreichend beschrieben... Dankeschön schon im Voraus. Achja, CSS- Kentnisse sind natürlich schon vorhanden. Liebe Grüße Steph |
Sponsored Links |
Sponsored Links |
|
|||
*edit: Schaut mal dort oben in der Navi... So ähnlich mein ich das.. Netzfeuilleton.de
*EDIT 2: Ich habe was gefunden, das einem ganz gut helfen kann! http://de.selfhtml.org/css/layouts/n...ten.htm#modern Jetzt müsste ich rein theoretisch nur noch rausfinden, wie sich die Links "nach oben weg" öffnen, wenn man drüber fährt... Also wenn ich es rausbekommen habe, werde ich den kompletten Code hier mal posten, falls noch jemand ein ähnliches Problem hat.. Trotzdem könnt ihr mir gerne helfen, wenn ihr wisst wie's geht. Grüßchen Okay.. Dann Achtung, es folgen: Eine Meeenge Codes. Vorab: Ich musste leider einmal absolut positionieren, da es anders nicht ging, den Text nach unten rechts zu bekommen.. Aber ich denke, das ist halb so wild.. Code für Container 1: Code:
#hauptnavi { width: 870px; height: 200px; margin-top: 3px; margin-bottom: 0px; } Code für Container 2: Code:
.navibg1 { margin-left:30px; background: url(images/cates.png) no-repeat; border: none; float:left; width: 260px; height: 149px; position:relative; } Code für Container 3: Code:
.navi1 { position: absolute; bottom: 12px; left: 10px; } Und nun zurück zum Problem... Ich weiß wie gesagt nicht, wie ich es einrichten kann, dass sich Links zeigen, wenn man über den 1. Link fährt. Code:
a.nav:link, a.nav:active, a.nav:visited { font-size: 140%; font-weight: bold; color: #262626; outline: none; } a.nav:hover { color: #212121; } Und nun noch eben wie es in html ausschaut: HTML-Code:
<div id="hauptnavi"> <div class="navibg1"> <div class="navi1"> <a href="http://example.com" class="nav">Kategorien</a> </div> </div> </div> Steigt da jemand durch? Ich habe versucht es so übersichtlich wie möglich zu machen.. Dankeschön für jede Hilfe Geändert von stephsteph (16.05.2010 um 09:50 Uhr) |
|
|||
So...
Mein Fazit: Man kann diese Seite SELFHTML: Stylesheets / CSS-basierte Layouts / Navigationsleisten WUNDERBAR dafür benutzen. Eigentlich brauche ich gar nichts mehr posten. Denn ein wenig CSS-Kenntnisse sollte Jeder haben... bekommt man locker hin. Außerdem steht dort echt schon alles! Wo ich nicht gleich drauf gekommen bin: Wenn man möchte, dass die Links nach oben ausklappen, anstatt nach unten (ich poste es einfach mal.. vielleicht hat irgendwann Jemand das selbe Problem) Folgendes Stückchen ändern: Code:
ul#Navigation li ul { margin: 0; padding: 0; position: absolute; BOTTOM: 1.6em; left: -0.4em; display: none; /* Unternavigation ausblenden */ } |
Stichwörter |
css, linkstyling |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Text ragt entweder hinaus oder wird verschoben | Der_FLo | CSS | 3 | 25.07.2006 23:14 |
Sidebarlänge dem Content anpassen?! | Pumpkin | CSS | 2 | 14.03.2006 18:21 |
Bildwechsel mit CSS als Link | Vira | CSS | 4 | 28.04.2005 14:44 |
xhtml validator error | doni | (X)HTML | 40 | 17.09.2004 06:20 |
JavaScript Trigger per Link zur Anzeige eines (CSS)DIV-Block | eugenandreas | CSS | 7 | 26.02.2004 20:28 |