Morgen.


Ich habe folgendes Problemchen:

Ich brauche einen Hover-Effekt fuer diese Navigation:

Klick.

Ich habe fuer jeden der Links in der Navigationsleiste jeweils eine blaue und eine orange Grafik. Die orangen Grafik sollen zum Einsatz kommen, wenn man den jeweiligen Link hovert, während die blaue Grafik generell statisch Verwendung findet.

Ich wollte es erst ähnlich wie hier versuchen:

Code: 
.navi a {
display:block;
width:100;
height:25px;
background: transparent url(img.jpg) no-repeat;
}

.navi a:hover {
background-position: -100px 0;
}
Es wird eine Grafik als background-image genutzt, in der beide zu verwendenden Grafiken abgebildet sind. Wird der Link gehovert, wird die Hintergrundgrafik quasi um minus 100 Pixel nach rechts verschoben, also effektiv 100 Pixel nach links.

Das Problem ist nur, dass die Grafiken nicht alle gleich breit sind. Ich habe aber das Selbe schon mal irgendwie hinbekommen, nur mit uebereinander liegenden Grafiken. Wie ich das hinbekommen hab, weiss ich allerdings nicht mehr.

Hat vielleicht jemand 'ne Idee, wie ich den gewuenschten Effekt sonst noch ohne JavaScript hinkriegen könnte?

Danke schon mal im Voraus! :]