Struppi: Bildwechsel per JS _ Div-übergreifend

Beitrag lesen

hallo,

ich möchte ein bildwechsel mit js realisieren.

folgender seitenaufbau:

  • ich habe 2 divs
  • im div A ist sind mehrere bilder
  • im div B ist 1 bild
  • die div sind absolute positioniert ;nebeneinander (also nicht
      verschachtelt)
  • nun sollte beim überfahren (onMouseOver) über eines der bilder
      im div A das eine bild im div B durch ein anderes bild(x)gross
      ersetzt werden

mein script dazu lautet:

Woher hast du dass Skript?
Das was du da schriebst ist NC 4.x only.

<script language="JavaScript">
  <!--
  H1 = new Image();
  H1.src = "bild1gross.gif";
  H2 = new Image();
  H2.src = "bild2gross.gif";
  H3 = new Image();
  H3.src = "bild3gross.gif";

ich möchte ja nicht meckern, aber das sieht doch so aus, als ob ein array angesagt wäre, oder?

function Bildwechsel(Divname,Bildnr,Bildobjekt)
  {
  document[Divname].document.images[Bildnr].src = Bildobjekt.src;
  }

So referenziert der NC 4.x Layer, du musst noch eine für IE 4.x und für alle anderne Browser einbauen.

-->
        </script>

der aufruf im html dokument:

<!-- in div A ist das auslösende Bild -->
<div id="A" style="...">
<img src="bild1.gif" onMouseOver="Bildwechsel('B',0,H1)">
<img src="bild2.gif" onMouseOver="Bildwechsel('B',0,H2)">
<img src="bild3.gif" onMouseOver="Bildwechsel('B',0,H3)">
</div>

<!-- in div B ist das auszutauschende Bild -->
<div id="B" style="...">
<img src="zuersetzen.gif">
</div>

leider funktioniert da was nicht. wo liegt der fehler?

Da kann ich nur sagen glasgoogle http://glasgoogle.de. funktioniert nicht ist eine absolut nichtsagende Fehlerbeschreibung.

Es gibt millionen über millionen mouseover skripte, dass du keines gefunden hast was funktioniert wundert mich.

Ich kann dir eines anbieten was zumindest in allen Browsern ausser NC 4.x funktioniert [linkl:http://home.arcor.de/struebig/js/mouse_over/mouse_over.htm]

Ansonsten:

<!-- in div B ist das auszutauschende Bild -->
<img name="B" src="zuersetzen.gif" id="B" style="...">

Das preload skript läßt sich auch verbessern:

<script type="text/JavaScript">
<!--
H = new Array();

function preload(nr)
{
    H[nr] = new Image();
    H[nr].src = 'bild' + nr + 'gross.gif';
}
preload(1);
preload(2);
preload(3);

function Bildwechsel(Bildnr)
{
var obj = null;
if(document.layers) obj = document.images['B'];
else if(document.getElementById) obj = document.getElementById('B');
else if(document.all) document.all['B'];

if(obj) obj.src = H[Bildnr].src;
}

wenn es denn wirklich ein positionierter Layer sein musss, muss die Zeile:
if(document.layers) obj = document.images['B'];

ergänzt werden:
if(document.layers) obj = document.layers['B'].document.images['B'];

Struppi.