zurück zur Startseite
  


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

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 12.06.2007, 11:56
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 12.06.2007
Beiträge: 6
Genesis befindet sich auf einem aufstrebenden Ast
Standard Hover via CSS

Hallo,

ich denke mal das Thema gab es schon öfter, allerdings ist mir kein anderer Titel eingefallen um das Ganze ein wenig zu differenzieren.

Im Grunde geht es um folgendes:

Ich habe über dieses - Script -, bzw diesen Code hier ein DropDown Menu auf unserer HP implementiert. Soweit so gut, es funktioniert alles. Das Problem ist:

Ich habe statt der Textlinks Images (PNGs) genutzt. Nun würde ich gerne jedem Image ein eigenes Hoverbild geben, das bei Mouseover erscheint.

Ich habe dazu mittlerweile erfahren das ich jedem Link einen eigenen ID-Selektor via CSS erstellen zu weisen muss.

Code:
/* Button 1 */

a#button1:link, a#button1:visited {
display: block;
width: 100px; /* entspricht Grafikbreite */
height: 20px; /* entspricht Grafikhöhe */
background: url(pfad/zur/grafik1_normal.png);
}
a#button1:hover {
background: url(pfad/zur/grafik1_hover.png);
}
Das Problem was ich nun habe scheint eines der richtigen Formatierung zu sein. Im Ursprung sah der Code so aus:

Code:
<li><a href="http://www.sternengarde.de/cms/index.php?option=com_content&task=view&id=16&Itemid=95" target="_self"><img src="templates/sternengarde/images/vg2.png" border="0"></a></li>
Wenn ich diesen nun in:

Code:
<li><a id="button1" href="http://www.sternengarde.de/cms/index.php?option=com_content&task=view&id=16&Itemid=95" target="_self"><img src="templates/sternengarde/images/vg2.png" border="0"></a></li>
ändere, dann scheint der Hover nur bedingt, bzw gar nicht zu funktionieren. Es wird zwar ein Bild angezeigt, aber dieses wird in den Hintergrund gelegt, was ja auch logisch erscheint.

Wie also müsste ich das Ganze formatieren um den Hover zu bekommen?

Die Homepage findet sich hier: - Link -

Das Menu erscheint wenn man im oberen Teil über die Bilder geht (Vangaurd, Warhammer). Den Code kann man auch über den Quelltext einsehen, da ich das Ganze noch nicht via css-Datei, bzw JS-Datei eingebunden habe.

Ich wäre für jedwede Hilfe sehr dankbar, und bedanke mich somit auch schon einmal im Voraus!

Beste Grüße vom,

Genesyst
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 12.06.2007, 12:04
Benutzerbild von Crizzo
der mit dem Editor kämpft
XHTMLforum-Kenner
 
Registriert seit: 17.10.2006
Ort: Ost-Hessen
Beiträge: 4.828
Crizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer Mensch
Standard

Cascading Style Sheets { Tutorial : Horizontal-Navigation mit gleitenden Hintergründen }
Cascading Style Sheets { Tutorial : Horizontal-Navigation mit gleitenden Hintergründen }
Cascading Style Sheets { Tutorial : Hybride CSS Menüs }

Lies mal das durch.
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen!
Foren-FAQ
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 12.06.2007, 12:23
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 12.06.2007
Beiträge: 6
Genesis befindet sich auf einem aufstrebenden Ast
Standard

Ich danke dir erstmal für die Links. Leider verwirrt mich das Ganze mehr als mir lieb ist wenn ich ehrlich bin. Mir fehlt einfach das wirkliche KnowHow um das alles zu verstehen, bin schon froh das ich das Menu überhaupt zum Laufen bekommen habe. Ich denke, auch wenns eigentlich blöd aussieht, das ich vorerst auf einen Hover verzichten werde. Anscheinend fehlen mir zum verständnis einfach die nötigen Grundlagen, da es auch das erste Mal ist das ich überhaupt mit Hovern arbeiten sollte.

Ich bedanke mich aber trotzdem vielmals!!

Grüße vom,

Genesis
Mit Zitat antworten
  #4 (permalink)  
Alt 12.06.2007, 12:26
Benutzerbild von Crizzo
der mit dem Editor kämpft
XHTMLforum-Kenner
 
Registriert seit: 17.10.2006
Ort: Ost-Hessen
Beiträge: 4.828
Crizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer MenschCrizzo ist ein sehr geschätzer Mensch
Standard

Grundlagen kannst du auf der Seite auch nachlesen
__________________
Ohne Quelltext gibts selten Hilfe. Also: Onlinebeispiel hochladen und Link bereitstellen!
Foren-FAQ
Mit Zitat antworten
  #5 (permalink)  
Alt 12.06.2007, 12:33
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 12.06.2007
Beiträge: 6
Genesis befindet sich auf einem aufstrebenden Ast
Standard

Also warum auch immer, nachdem ich es jetzt nochmal mit den IDs probiert habe, hat es plötzlich funktioniert, warum weiss wohl nur der liebe Gott selber, denn ich hatte es schon vorher so...

Ich denke damit hat sich zumindest dieses Problem erledigt!

Vielen dank nochmal!

Grüße vom,

Genesis
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

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
Hilfe bei CSS Navigation trimalchio CSS 7 10.01.2011 13:13
2 Tabellen via CSS unterschiedlich bestimmen philogyn CSS 2 21.05.2010 10:33
Hover Effekt mit Buttons und CSS fossy CSS 1 30.10.2007 14:00
Css Hover Frage xero CSS 13 11.05.2007 04:13


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