Tilfeldige bilder med JavaScript

Her er en enkel JavaScript-kode som viser et tilfeldig bilde, og som kan brukes på en hjemmeside eller blogg. JavaScript-snutten bruker random-funksjonen for å skifte på hvilket bilde som blir vist.

Koden er også et eksempel på JavaScript-programmering. Den viser bruk av funksjonen Math.random() for å generere tilfeldige tall, funksjonen document.getElementById() for å få tak i HTML-elementer, samt endring av HTML-attributter ved hjelp av document.setAttribute()

Kode-snutt

<img id="bildet" name="bildet" alt=""
    src="http://www.joblogg.com/bilder/bilde001.jpg" />

<script type="text/javascript"><!--

 var antallBilder = 3;

 var tilfeldigTall = Math.floor( antallBilder * Math.random() );

 var bildet = document.getElementById( "bildet" );
 var bildeUrl;
 
 if(tilfeldigTall == 0)
 {
    bildeUrl = "http://www.joblogg.com/bilder/bilde001.jpg";
 }
 else if(tilfeldigTall == 1)
 {
    bildeUrl = "http://www.joblogg.com/bilder/bilde002.jpg";
 }
 else if(tilfeldigTall == 2)
 {
     bildeUrl = "http://www.joblogg.com/bilder/bilde003.jpg";
 } 
 
 bildet.setAttribute( "src", bildeUrl );

//--></script>

JavaScript-koden i bruk:

Det er tilfeldig hvilket av de tre bildene som settes inn for hver gang denne siden lastes.

Tilpasning av kode-snutt

 var antallBilder = 3;

bildeUrl = "ADRESSEN TIL DITT BILDE HER";

 else if(tilfeldigTall == 3)
 {
  bildeUrl = "ADRESSEN TIL BILDET NR 4";
 }
else if(tilfeldigTall == 4)
 {
  bildeUrl = "ADRESSEN TIL BILDET NR 5";
 }