molily: Erstellung eines Java-Scripts

Beitrag lesen

Hallo,

Dieser Effekt soll mit einem Java-Script gemacht werden

Warum? Warum nicht mit CSS?
Du kannst z.B. a-Elemente entsprechend absolut positionieren, sodass sie als Rechtecke über den Kugeln liegen. Beim :hover wird das Hintergrundbild geändert und der Text eingeblendet. Schematisch:

<a href="..." id="link1"><span>Text</span></a>

#link1 {  
   display:block;  
   width:...px;  
   height:...px;  
   position:absolute;  
   top:...px;  
   left:...px;  
}  
#link1:hover {  
   background-image:url(kugel_hervorgehoben.png);  
   background-position:center left;  
   background-repeat:none;  
   /* usw. */  
}  
#link1 span {  
   text-indent:-9999px; /* ausblenden */  
}  
#link1:hover span {  
   text-indent:0; /* einblenden */  
   padding-left:...px;  
   /* eventuell noch positionieren mit position:absolute oder position:relative */  
}

Selbst wenn du die Ein- und Ausblenden-Logik mit JavaScript löst, wäre es sinnvoll, Elemente über die Kugeln zu legen. Eine JavaScript-Lösung würde also dieselbe Grundlage haben.

Mathias