© ilj ilj@flowsim.se
JavaScript på svenska 50
I det här exemplet förladdas inte bilderna.
Jfr exempel 16 där alla bilder laddas samtidigt som sidan laddas!
> bildvisare med bildtexter

 
 
BILD 1 22K
BILD 2 20K
BILD 3 12K
 
kod
&
förklaringar

image

 


 
1 Placera en FORM någonstans mellan BODY -taggarna:
 

<FORM NAME ="
iljform">
<INPUT TYPE = "
radio"
     NAME = "
iljradio"
     CHECKED
     onClick = "
if(this.checked) {iljval('bildfil1.gif')}">bildtext
<INPUT TYPE = "
radio"
      NAME = "
iljradio"
     onClick = "
if(this.checked) {iljval('bildfil2.gif')}">bildtext
etc

</FORM>

 
Efter onClick placerar man anropet, dvs namnet på den funktion som ska se till att rätt bild visas. Skriv namnet på den bildfil som ska visas mellan parenteserna och omge det med enkla citationstecken. Om man vill visa bild(fil)en "flower.jpg" skriver man alltså ('flower.jpg').
 
2 Placera en bild någonstans:
 
<IMG NAME = "switch1"
SRC= "
bild1"
WIDTH = "
pixel"
HEIGHT = "
pixel">
 

 
Namnge bilden - här switch1, ange bredd och höjd i pixel och bestäm vilken bild som ska visas när sidan laddas. Det blir också den enda bild som kommer att visas i webbläsare där man inte kan byta bilder.
 
Man kan ta bort NAME="swicth1" och samtidigt (i javascript-koden) ändra raden
 
document.switch1.src
 
till
 
document.images[i].src
 
där i byts ut mot en nolla (0) om den IMG-tagg där bilderna ska visas är den första IMG-taggen på sidan, mot en etta (1) om IMG-taggen är den andra IMG-taggen på sidan osv.
 
3 Placera koden i HEAD-delen i vanlig ordning (se MINIMANUAL 1 lite grunder).
 
Så här ser koden ut:

function iljval(valdbild) //1
{
if(document.images)
     {
      document.switch1.src = valdbild //2
     }
}
window.onerror = null;
 
1 det ord som finns mellan parenteser och citationstecken i anropet efter onClick kommer alltså in i funktionen som valdbild
 
2 här visas den nya bilden.

 

 
Man kan förladda alla bilder (som t ex i exempel 16 images/onChange. Sidan tar längre tid att ladda, men när den väl är färdigladdad kommer varje bild att finnas på plats så snart man klickar på ett alternativ.

 

Sidan gjordes av
 
ilj
 
ilj@flowsim.se
 
Senast ändrad 14 september 1998.

Den här sidan hör hemma i ett ramsystem
hos:
www.flowsim.se
JavaScript på svenska