Tekst en plaatjes in willekeurige volgorde tonen

Tekst en plaatjes in willekeurige volgorde tonen


Wanneer je een stuk tekst, een plaatje of een ander soort content wilt tonen in willekeurige volgorde, en iedere keer
iets anders wilt laten zien als een bezoeker op je site komt, kun je gebruik maken van een handig stukje javascript.
We maken hierbij gebruik van javascript’s Math.round() en Math.random(), deze selecteren en laten een willekeurig stuk
content zien van een serie.

Eerst zul je de lijst moeten maken van datgene dat je wilt laten zien. Dit kun je in de head van je document plaatsen,
handiger is om een aparte pagina aan te maken met de naam ‘random.js’. Dit bestand kun je dan oproepen door de volgende
code in je header te plaatsen:

Nu de invulling van random.js. Dit ziet er als volgt uit:

randContent = new Array();
randContent[0] = “…item 0…”;
randContent[1] = “…item 1…”;
randContent[2] = “…item 2…”;
randContent[3] = “…item 3…”;
randContent[4] = “…item 4…”;
randContent[5] = “…item 5…”;
var numb = randContent.length-1;
var mathRandom = Math.random();
var mathRound = Math.round((mathRandom*numb));
var randDisplay = randContent[mathRound];

Merk wel even op dat Javascript arrays altijd bij nul beginnen te tellen, vergeet dat niet!
Daarnaast moet je als je html-code gebruikt in een script even ‘ gebruiken op de plek waar je ” normaal gebruikt en
daar een voor zetten. Dat geldt ook voor /, dat moet veranderen in /. Bijvoorbeeld
“<param name=’allowScriptAccess’ value=’sameDomain’ />” in een stukje script voor Flash.

Op de plek waar je nu daadwerkelijk je content wilt tonen moet je de volgende code plaatsen:

Op de plek van item 0 enzovoort kun je willekeurig wat kwijt, zoals uitspraken van bezoekers, plaatjes, topverkopen,
flash movies en zelfs advertenties. Op de voorbeeldpagina
laten we zien wat je er mee kunt doen. Moet je wel af en toe even op vernieuwen
klikken om het resultaat te kunnen zien.

          Leuk als je dit artikel deelt:
Share

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Verplichte velden zijn gemarkeerd met *