suche script für hintergrundbild mouseover onclick..

[Jeena Paradies]

Hallo bigi,

:) wow bin ich froh das ich mal ne vernünftige antwort gekriegt habe!
weil ist nicht das erste forum das ich nerve....

Na wir sind doch hier professionell ;)

Was das gute dabei ist ist dass der Quelltext auch viel kleiner wird:

---

<script language="JavaScript" type="text/javascript">
<!--
letztes="";
function changeImage(tdId,imgFile)
{ if(letztes!=backgroundImage)
{document.style.backgroundImage[tdId].src=imgFile;}
}

function druecken(backgroundImage,imgFile)
{ document.style.backgroundImage[tdId].src=imgFile;
if(letztes!=""&&letztes!=tdId)
{document.style.backgroundImage[letztes].src='url(navi_images/orange.jpg)';}
letztes=tdId;}
//-->
</script>

<table border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td onMouseover="changeImage.this.style.backgroundImage=('bgimg','url(navi_images/gray.jpg)');"
  onMouseout="changeImage.this.style.backgroundImage=('bgimg','url(navi_images/orange.jpg)');"
  onclick="druecken.this.style.backgroundImage=('bgimg','url(navi_images/gray.jpg)');" width="98" height="39" id="bgimg" style="background-image: url(navi_images/orange.jpg)"><div class="top"><a href="#">erster Menüpunkt</div></a></td>
<td onMouseover="changeImage.this.style.backgroundImage=('bgimg','url(navi_images/gray.jpg)');"
  onMouseout="changeImage.this.style.backgroundImage=('bgimg','url(navi_images/orange.jpg)');"
  onclick="druecken.this.style.backgroundImage=('bgimg','url(navi_images/gray.jpg)');" width="98" height="39" id="bgimg" style="background-image: url(navi_images/orange.jpg)"><div class="top"><a href="#">zweiter Menüpunkt</div></a></td>
<td onMouseover="changeImage.this.style.backgroundImage=('bgimg','url(navi_images/gray.jpg)');"
  onMouseout="changeImage.this.style.backgroundImage=('bgimg','url(navi_images/orange.jpg)');"
  onclick="druecken.this.style.backgroundImage=('bgimg','url(navi_images/gray.jpg)');" width="98" height="39" id="bgimg" style="background-image: url(navi_images/orange.jpg)"><div class="top"><a href="#">dritter Menüpunkt</div></a></td>
<td onMouseover="changeImage.this.style.backgroundImage=('bgimg','url(navi_images/gray.jpg)');"
  onMouseout="changeImage.this.style.backgroundImage=('bgimg','url(navi_images/orange.jpg)');"
  onclick="druecken.this.style.backgroundImage=('bgimg','url(navi_images/gray.jpg)');" width="98" height="39" id="bgimg" style="background-image: url(navi_images/orange.jpg)"><div class="top"><a href="#">vierter Menüpunkt</div></a></td>
<td onMouseover="changeImage.this.style.backgroundImage=('bgimg','url(navi_images/gray.jpg)');"
  onMouseout="changeImage.this.style.backgroundImage=('bgimg','url(navi_images/orange.jpg)');"
  onclick="druecken.this.style.backgroundImage=('bgimg','url(navi_images/gray.jpg)');" width="98" height="39" id="bgimg" style="background-image: url(navi_images/orange.jpg)"><div class="top"><a href="#">fünfter Menüpunkt</div></a></td>
 </tr>
</table>

---

Im vergleich dazu der neue Quellcode:

---

<ul id="menue">
 <li><a href="">erster Menüpunkt</a></li>
 <li><a href="">zweiter Menüpunkt</a></li>
 <li>dritter Menüpunkt</li>
 <li><a href="">vierter Menüpunkt</a></li>
 <li><a href="">fünfter Menüpunkt</a></li>
</ul>

---

Und alle Formatierungen sind dann in der Externen CSS Datei und müssen nur ein mal heruntergeladen werden.

Grüße
Jeena Paradies