kod & förklaringar längre ner |
1 Förladda de bilder du tänker använda genom att placera följande kod mellan SCRIPT-taggar i HTML-sidans HEAD-del: if(document.images) { bild=new Array() bild[0]=new Image() bild[1]=new Image() //fortsätt ev med fler bilder: bild[2], bild[3] etc bild[0].src="MOUSEOUTBILD" bild[1].src="MOUSEOVERBILD" //fortsätt ev med fler bilder: bild[2].src, bild[3].src etc } I stället för MOUSEOUTBILD och MOUSEOVERBILD fyller du i filnamnen på de bilder du tänker använda, till exempel dinbild1.gif: bild[0].src="dinbild1.gif" bild[1].src="dinbild2.gif" 2 Placera en bild på sidan. Ge varje bild där du tänker växla bilder ett unikt namn (efter NAME). I följande exempel har bilden fått namnet plats1. <A HREF="URL" ONMOUSEOVER= "if(document.images){document.images['plats1'].src=bild[1].src}" ONMOUSEOUT= "if(document.images){document.images['plats1'].src=bild[0].src}"> <IMG SRC="enbild.gif" BORDER="0" ALT="" NAME="plats1"></A> När en ONMOUSEOVER inträffar visas den bild du laddat in efter bild[1].src (se kodavsnittet under punkt 1 ovan). Om du laddat in en bild efter bild[2].src och vill visa den vid en MOUSEOVER på något annat ställe på sidan kan den IMG-taggen se ut så här: <A HREF="URL" ONMOUSEOVER= "if(document.images){document.images['plats2'].src=bild[2].src}" ONMOUSEOUT= "if(document.images){document.images['plats2'].src=bild[0].src}"> <IMG SRC="enbild.gif" BORDER="0" ALT="" NAME="plats2"></A> |
Fler JavaScript-exempel: image/mouseover variant varannan dag bildväxl/animering välja bild i rullgardinsmeny meddelandefönster datum & tid meddelande onLoad onFocus lastModified image/mouseover onblur klocka history images/ animation ändra bakgrundsfärg timer rörlig text i textarea JavaScript confirm mer om datum öppna nytt fönster 1 öppna nytt fönster 2 JavaScript prompt flytande lager [fler JavaScript-exempel hittar du i menyn i ramen till vänster] Sidan gjordes av ilj@flowsim.se Senast ändrad 22 mars 2004 Den här sida hör hemma i ett ramsystem hos: www.flowsim.se JavaScript på svenska |