zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden CSS Menu Hover Frage

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 01.01.2007, 17:31
Benutzerbild von Peter Klein
CSS-Fetischist
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 27.02.2006
Ort: Berlin
Beiträge: 375
Peter Klein befindet sich auf einem aufstrebenden Ast
Standard 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
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 01.01.2007, 18:35
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von Peter Klein Beitrag anzeigen
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 anzeigen
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?
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 01.01.2007, 19:11
Benutzerbild von Peter Klein
CSS-Fetischist
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 27.02.2006
Ort: Berlin
Beiträge: 375
Peter Klein befindet sich auf einem aufstrebenden Ast
Standard

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?
Mit Zitat antworten
  #4 (permalink)  
Alt 01.01.2007, 20:05
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von Peter Klein Beitrag anzeigen
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 anzeigen
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 anzeigen
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.

Geändert von heiko_rs (01.01.2007 um 20:11 Uhr)
Mit Zitat antworten
  #5 (permalink)  
Alt 01.01.2007, 20:58
Benutzerbild von Peter Klein
CSS-Fetischist
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 27.02.2006
Ort: Berlin
Beiträge: 375
Peter Klein befindet sich auf einem aufstrebenden Ast
Standard

Oki, das muss ich jetzt erst mal bissl verarbeiten mit dem Hovereffekt in anderem Container.Melde mich wieder
Mit Zitat antworten
  #6 (permalink)  
Alt 01.01.2007, 21:08
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.848
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

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).
Mit Zitat antworten
  #7 (permalink)  
Alt 01.01.2007, 21:21
Benutzerbild von Peter Klein
CSS-Fetischist
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 27.02.2006
Ort: Berlin
Beiträge: 375
Peter Klein befindet sich auf einem aufstrebenden Ast
Standard

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.
Mit Zitat antworten
Antwort


Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Redesign für Steiner Cycling Team pkipper Site- und Layoutcheck 11 09.02.2011 12:25
Reines CSS-Menu klappt im IE6 nicht, hover verliert Wirkung... Praktikant CSS 19 28.04.2008 15:28
CSS Einsteiger bittet um Hilfe pcklinik CSS 0 06.09.2007 14:40
Problem mit Menu und CSS im IE 6 Valentin- CSS 2 31.01.2007 16:45
Horizontale Leiste mit Css und xhtml formatieren bettina CSS 1 06.01.2007 12:49


Alle Zeitangaben in WEZ +2. Es ist jetzt 15:30 Uhr.