Animierte Buttons mit JavaScript

**der Eine** · 31.08.2002, 22:31

Re: Animierte Buttons mit JavaScript

Ich hoff mal ich hab das Script richtig gelesen:

.....
<html>
<head>
<title>Right Said Fred</title>
<script language="JavaScript">
var x=0;
var button_1,button_2;
var buttons = new Array("home.gif","home1.gif","news.gif","news1.gif","tv.gif","tv1.gif","tour.gif",
"tour1.gif","charts.gif","charts1.gif","bio.gif","bio1.gif","disco.gif","disco1.gif","songtexte.gif" ,"songtexte1.gif","audio.gif",
"audio1.gif","fotos.gif","fotos1.gif","shop.gif","shop1.gif","umfragen.gif","umfragen1.gif","forum.g if","forum1.gif","chat.gif",
"chat1.gif","buch.gif","buch1.gif");

function wechsel(button_1,button_2)
{
var button=new Image();
button.src=buttons[button_2];
window.document.images[button_1].src=button.src;
}

</script>
</head>
<body bgcolor="#0000A0">
<br>
<br>
<br>
<br>
<a href="home.html" target="rechts" onMouseOver="wechsel(0,1)" onMouseOut="wechsel(0,0)"><img src="home.gif" border="0"></a><br>
<a href="home.html" target="rechts" onMouseOver="wechsel(1,3)" onMouseOut="wechsel(1,2)"><img src="home.gif" border="0"></a>....
</body>
</html>

der Eine

**Scotty** · 31.08.2002, 23:09

So geht es auch:

PHP-Code:


<html>



<head>

<meta name="GENERATOR" content="Proton 3.1">

<meta name="ProgId" content="FrontPage.Editor.Document">

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<script language="JavaScript" type="text/JavaScript">

<!--

function MM_swapImgRestore() { //v3.0

  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;

}



function MM_preloadImages() { //v3.0

  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();

    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)

    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}

}



function MM_findObj(n, d) { //v4.01

  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {

    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}

  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];

  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);

  if(!x && d.getElementById) x=d.getElementById(n); return x;

}



function MM_swapImage() { //v3.0

  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)

   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}

}

//-->

</script>

</head>



<body bgcolor="#76AAD9" topmargin="0" onLoad="MM_preloadImages('button1.gif')">



    <a onMouseOver="MM_swapImage('button1','','button1.gif',1)" onMouseOut="MM_swapImgRestore()" href="index.html">

    <img border="0" src="button1.gif" alt="button1" name="button1"</a></p>



</body></html>

**Picard** · 01.09.2002, 10:47

Sorry, ich habe hier versehentlich MouseOver statt MouseOut geschrieben, aber mit den neuen Werten gehts. Danke euch.

P.S.: Ich habe hier noch ein Problem mit dem zweiten Button:
Wenn ich den Button mit dem Mauszeiger berühre verändert sich der nächste Button tv.gif zu news1.gif statt news.gif zu news1.gif

<a href="news.html" target="rechts" onMouseOver="wechsel(2,3)" onMouseOut="wechsel(2,2)"><img src="news.gif" border="0"></a>

Was ist denn schon wieder falsch, wenn doch eh news.gif Platz 2 im Array belegt und news1.gif Platz 3???

P.S.S.: Ganz hab ich's nicht verstanden, aber ich hab's geschafft, indem ich das so abgeandert habe:
<a href="news.html" target="rechts" onMouseOver="wechsel(1,3)" onMouseOut="wechsel(1,2)"><img src="news.gif" border="0"></a>

Gibt der erste Wert immer den Index des Bildes und der Zweite den Index des Array-Elements an?

P.S.S.S: Okay, ich habs verstanden...

Ankündigung

Animierte Buttons mit JavaScript

Kommentar

Kommentar

Kommentar