JavaScript på svenska 12b
JavaScript onMouseOver och JavaScript onMouseOut
TRE BILDER - DEN TREDJE VISAS BARA VID VAR FEMTE ONMOUSEOVER. |
kod & förklaringar längre ner
|
PLACERA BILDEN PÅ HTML-SIDAN MED HJÄLP AV FÖLJANDE TAGGAR: <A HREF = "mailto:namn@adress.se" onMouseOver = "iljswtch2(1,1)"1 onMouseOut = "iljswtch2(0,0)">2 <IMG NAME = "switch1"3 SRC= "bildfil"4 WIDTH = "pixel" HEIGHT = "pixel" BORDER = "0"></A> Byt ut min mailadress, ersätt bildfil med namnet på den fil du tänker använda, fyll i bildens bredd och höjd i stället för pixel och ta bort alla fotnoter här ovanför. Resten av koden placeras i HEAD-delen (se MINIMANUAL 1 lite grunder): <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript"> <!-- if(document.images)//5 { bild = new Array() bild[0]= new Image() bild[1]= new Image() bild[0].src= "bildfil"//13 bild[1].src= "bildfil"//14 } iljover=0 //6 function iljswtch2(nummer,inb) { if(document.images) { if(inb==1) //7 { iljover = iljover+1 //8 } document.switch1.src = bild[nummer].src //3,9 if(iljover==5) //10 { document.switch1.src = "bildfil" //3,11 iljover=0 //12 } } } //--> </SCRIPT> 1 här anropas funktionen iljswtch2() med argumenten 1 (nummer) och 1 (inb,som talar om att det är en mouseover och inte en mouseout) 2 här anropas funktionen iljswtch2() med argumenten 0 (nummer) och 0 (inb,som talar om att det är en mouseout) 3 ge bilden ett namn vilket som helst 4 den bild som visas när sidan laddas, innan någon mouseover ägt rum 5 här följer förladdningen av bilderna - man kan förstås "förladda" även den tredje bilden 6 iljover håller reda på hur många gånger onMouseOver ägt rum, här sätts iljover till att börja med till 0 7 om inb är lika med 1, dvs om en mouseover ägt rum så... 8 räknas iljover upp med 1 9 här sker den "normala" bildväxlingen men... 10 om iljover är lika med 5, dvs efter fem mouseover så... 11 visas den tredje bilden och ... 12 iljover sätts till 0 igen 13 bilden som ska visas vid onmouseout 14 bilden som ska visas vid onmouseover 
Istället för att använda IMG-taggens NAME-attribut för att identifiera bildplatsen kan man byta ut raderna document.switch1.src mot document.images[i].src Om bilden som ska bytas är den första på sidan ska i bytas ut mot 0, om bilden är sidans andra bild ska i bytas ut mot 1 etc. Gör man på det här sättet kan NAME="switch1" plockas bort. Fler JavaScript-exempel:  onmouseover 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 2 april 2004. Den här sidan hör hemma i ett ramsystem hos www.flowsim.se JavaScript på svenska |