XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   CSS Menu Hover Frage (http://xhtmlforum.de/showthread.php?t=43681)

Peter Klein 01.01.2007 17:31

CSS Menu Hover Frage
 
Hallo

Ich erstelle gerade eine Seite für eine Bildergalerie ( Bildergalerie Schwerfen ), und habe als Menu ganz normalen Text genommen, etwas formatiert.

Und beim Hovern sollen sich jetzt unter diesem Container (Menu) , aber etwas über der Linie die kleinen Thumbnails verändern. Werden noch erstellt.

Vor dem Hovern werden natürlich schon kleine THumbs da sein.

So, meine Frage nun,wie realisiere ich das? Da hänge ich jetzt etwas.

Peter

heiko_rs 01.01.2007 18:35

Zitat:

Zitat von Peter Klein (Beitrag 319536)
habe als Menu ganz normalen Text genommen

Sehr unschön. Nimm eine Liste ul und positioniere die einzelnen li absolut (ul bekommt dafür position: relative; und eine passende Dimension).

Zitat:

Zitat von Peter Klein (Beitrag 319536)
Und beim Hovern sollen sich jetzt unter diesem Container (Menu) , aber etwas über der Linie die kleinen Thumbnails verändern.

Ebenfalls per position: absolute; und z.B. mit span innerhalb von a. Für konkretere Angaben wäre gut zu wissen, welche Funktion die Thumbs auf der Seite haben werden - sind sie Dekoration, d.h. für die Funktionalität der Seite letztlich nicht relevant?

Peter Klein 01.01.2007 19:11

Das mit dem text soll so sein, das er so formatiert ist.

Vieleicht wird er auch komplett weggelassen und stattdessen eine hübsche Navbar eingebaut.

Richtig, die Thumbnails sollen nur als Nebeneffekt da sein, also keine Funktion auf der Webseite erfüllen etc.

Das was ich meinte, wie ich den Hover effekt in einem anderen Container anzeigen lassen kann?

heiko_rs 01.01.2007 20:05

Zitat:

Zitat von Peter Klein (Beitrag 319548)
Das mit dem text soll so sein, das er so formatiert ist.

Diese Lösung ist totaler Pfusch, ein Menü gehört in eine Liste. Aber wenn Du partout pfuschen willst, tu's halt.

Zitat:

Zitat von Peter Klein (Beitrag 319548)
Vieleicht wird er auch komplett weggelassen und stattdessen eine hübsche Navbar eingebaut.

Keine gute Idee. Ins Markup gehören normale Textlinks, Grafiken kommen per CSS.

Zitat:

Zitat von Peter Klein (Beitrag 319548)
Das was ich meinte, wie ich den Hover effekt in einem anderen Container anzeigen lassen kann?

Linktext in span, per text-indent: -9999px; verschwinden lassen, und dann span im Link-"Normalzustand" per position: absolute; und left: -9999px; die Hover-Grafiken preloaden und dann per a:hover span am gewünschten Platz anzeigen lassen (d.h. passende Werte für left und top). Bei (zu erwartenden) IE-Problemen nochmal posten.

EDIT: Es ist zwar selbstverständlich, aber sicherheitshalber füge ich noch hinzu, daß jedes li (nicht a) eine ID bekommt, über die a und span per Nachfahrenselektor individuell angesprochen werden. Die IDs dienen darüberhinaus zur Positionierung von li.

Peter Klein 01.01.2007 20:58

Oki, das muss ich jetzt erst mal bissl verarbeiten mit dem Hovereffekt in anderem Container.Melde mich wieder

heiko_rs 01.01.2007 21:08

Zur Verdeutlichung: Die Hover-Grafik wird nur scheinbar in einem anderen Container angezeigt; tatsächlich ist sie Teil von a und wird nur durch position: absolute; "in" den betreffenden Container gestellt, vielmehr über denselben (da sie seine Inhalte überdeckt).

Peter Klein 01.01.2007 21:21

Ok, haben es jetzt anders besprochen, werde das Menu dann doch in eine Liste machen.

Und diese kommt in Höhe des halbtransparenten Streifens auf dem Bild.

Der Streifen wird mittels CSS als Hintergrundbild auf die Seite gelegt und genau in diesen kommt die Navi rein.


Alle Zeitangaben in WEZ +2. Es ist jetzt 22:50 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2022, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2022