Einzelnen Beitrag anzeigen
  #5 (permalink)  
Alt 24.07.2010, 01:14
ronjambo ronjambo ist offline
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 04.03.2009
Beiträge: 35
ronjambo befindet sich auf einem aufstrebenden Ast
Standard

Nach langer Zeit habe ich mich mal wieder mit dem Thema beschäftigt und eine Lösung gefunden. Es ist wirklich schwierig, etwas im Netz darüber zu finden. Im Prinzip ist es sehr simpel:
Damit der Link nicht "flackert" fügt man beide Bilder eines Links zu einem zusammen, im folgenden Beispiel horizontal [normal_link1.jpg|hover_link1.jpg] = normal_hover_link1.jpg usw.

Das CSS sieht dann wie folgt aus:
PHP-Code:
a.seite1{display:block;width:50px;height:50px;background:transparent url(normal_hover_link1.jpgno-repeat;}
a.seite1:hover{background-position:-50px 0;}
a.seite1_visited{display:block;width:50px;height:50px;background:transparent url(normal_hover_link1.jpg) -50px 0 no-repeat;}

a.seite2{display:block;width:50px;height:50px;background:transparent url(normal_hover_link2.jpgno-repeat;}
a.seite2:hover{background-position:-50px 0;}
a.seite2_visited{display:block;width:50px;height:50px;background:transparent url(normal_hover_link2.jpg) -50px 0 no-repeat;} 
und der restliche Code:

Seite 1:
PHP-Code:
<a href="seite1.html" class="seite1_visited"></a>
<
a href="seite2.html" class="seite2"></a
Seite 2:
PHP-Code:
<a href="seite1.html" class="seite1"></a>
<
a href="seite2.html" class="seite2_visited"></a
Wenn es noch eleganter, schöner, kürzer usw. geht, bin ich offen für alles...

Greetz
Mit Zitat antworten