nicht angemeldet
Hallöchen,
wie muß man sich das Ganze denn vom Aufbau her vorstellen ? Soll es sich um zwei Grafik-Links handeln, bei denen wechselseitig beide Grafiken ausgetauscht werden oder soll es ein Grafik-Link sein, bei dem onmouseover die Link-Grafik geändert und irgendwo auf der Seite noch eine weitere Grafik geändert werden soll, die allerdings keine Link-Funktionalität besitzt ?
Wenn das zweite der Fall ist, hätte ich spontan eine Lösung, die auf jeden Fall beim Arbeiten mit Layern funzt:
Irgendwo auf der Seite ist der Grafik-Link und irgendwo anders auf der Seite wird die in einem Layer positionierte Grafik_A angezeigt, die bei onmouseover ebenfalls geändert werden soll. Es ist ein weiterer Layer mit denselben Koordinaten des Layers der Grafik_A zu definieren, der die Grafik_B enthält und dessen visibility auf hidden gesetzt wird. Der zweite Layer ist im Quellcode der Seite nach dem ersten Layer zu positionieren !
Im Head müssen dann drei Scripte untergebracht werden:
1.) Rollover-Script (Cross-Browser)
<!--
if (document.images) {
image1 = new Image;
image1a = new Image;
image1.src = 'bild_1_normal.gif';
image1a.src = 'bild_1_over.gif';
image2 = new Image;
image2a = new Image;
image2.src = 'bild_2_normal.gif';
image2a.src = 'bild_2_over.gif';
} //und so weiter ...
else {
image1 = '';
image1a = '';
image2 = '';
image2a = '';
document.rollimg = '';
document.rollimg1a = '';
document.rollimg2a = '';
} // und so weiter ...
//-->
2.) Script für die Änderung der visibility von Layern © Eddie Traversa (nirvana.media3.net) - ebenfalls Cross-Browser
<!--
function toggleVisibility(id, NNtype, IEtype, WC3type) {
if (document.getElementById) {
eval("document.getElementById(id).style.visibility = "" + WC3type + """);
} else {
if (document.layers) {
document.layers[id].visibility = NNtype;
} else {
if (document.all) {
eval("document.all." + id + ".style.visibility = "" + IEtype + """);
}
}
}
}
//-->
3.) Preloading für die Alternativ-Grafiken
Der Code für den ersten Grafik-Link sieht dann wie folgt aus:
<a href="irgendwo.html" onmouseover="document.rollimg1a.src=image1a.src;toggleVisibility('layer_grafik_b','show','visible','visible')" onmouseout="document.rollimg1a.src=image1.src;toggleVisibility('layer_grafik_b','hidden','hidden','hidden')">
Also bei den entsprechenden mouse-events einfach zwei Funktionen aufrufen !
Gruß :o)
Olaf