Juergens-Workshops.de Forum
Frage wegen "Bildhover" und menü "auslagern" - Druckversion

+- Juergens-Workshops.de Forum (https://forum.juergens-workshops.de)
+-- Forum: HTML und Co (https://forum.juergens-workshops.de/forumdisplay.php?fid=62)
+--- Forum: Rund um HTML (https://forum.juergens-workshops.de/forumdisplay.php?fid=83)
+--- Thema: Frage wegen "Bildhover" und menü "auslagern" (/showthread.php?tid=22180)



Frage wegen "Bildhover" und menü "auslagern" - phil100 - 08.04.2007

Hallo, ich bin gerade dabei mir eine HTML/CSS HP zu machen, hab eigentlich mit nix probleme außer eine Sache bekomm ich nit hin und die andere weiß ich nit ob das richtig ist:
Also, 1. Meine navigation besteht aus "Bilder Links" also verlinkte Grafiken ich schaffe es jedoch nicht einen Hover einzufügen, als Hover ist für jeden Link einen eigene Grafik gedacht. Wie mach ich das , ein Beispiel Code wäre nett.

2.
Im moment habe ich mein menü in allen dateien drinstehen, das blöde daran ist nur das wenn ich einen menü Punkt ändere das ich dann alles neu machen darf, geht das auch anders? Hab über google was gefunden mit dem PHP include Befehl einfügen ist das ne saubere Lösung?Wie sollte man es am besten machen?

mfg
phil100

PS: Alle dateien sind .php dateien da in 1-2 Seiten PHP Scripte verwendet werden, nur falls das wichtig ist.


Frage wegen "Bildhover" und menü "auslagern" - Kylee - 09.04.2007

Beispiel 3 stufiges Layout mit Tabelle und include :

[HTML]<table><tr><td colspan="2"><?php include ('head.php');?></tr></td><tr><td><?php include ('navi.php');?></td><td><?php include ('main.php');?></td></tr></table>[/HTML]

hover (in der css datei z.B.) :
[HTML]a:hover {
color: #FFA500;
font-weight: bold;
font-size: 12px;
border-style: outset;
width: 140px;
height: 40px;
border-color: Yellow;
font-family: "Comic Sans MS";
background-image: url(Bilder/hover.jpg); }[/HTML]



Ich geh aber davon aus das du ein mouseover effekt erzeugen willst der nicht für jeden button gleich ist also musst du eine class vergeben z.B.

[HTML].button1 a:hover {
color: #FFA500;
font-weight: bold;
font-size: 12px;
border-style: outset;
width: 140px;
height: 40px;
border-color: Yellow;
font-family: "Comic Sans MS";
background-image: url(Bilder/hover.jpg); }[/HTML]

und der dazugehörende link :

[HTML]<a href="xxx.php" class="button1" >dein link</a>[/HTML]

LG

Kylee


Frage wegen "Bildhover" und menü "auslagern" - Helmut - 09.04.2007

Hi,

was auch geht ist der Trick mit einer Navigationsgrafik für alle Links und dann bei Hover die Anpassung der Background Position vorzunehmen. Vorteil ist das man sich das Vorladen der Grafiken erspart.

Wie das geht ist mitsamt eines Beispieles hier beschrieben

Cu Helmut