mardi 18 octobre 2016

switch from image to random image onclick with JavaScript

I'm trying to build something that would resemble a slide show, where you have an image and when you click on it, it is replaced by another randomly in my series of images. I first tried with simple html, but of course the images don't switch randomly. So I did my research and found that it could be done with an array in Javascript. I just don't really know a lot about javascript...

This is what I could find but it doesn't work, I'm sure there is a stupid mistake in there that I can't see :

this is my javascript

function pickimg2(){
var imagenumber = 2 ;
var randomnumber = Math.random() ;
var rand1 = Math.round( (imagenumber-1) * randomnumber) + 1;
myImages1 = new Array();
    myImages1[1] = "img_01.gif";
    myImages1[2] = "img_02.gif";
    myImages1[3] = "img_03.gif";
    myImages1[4] = "img_04.gif";
    myImages1[5] = "img_05.gif";
    myImages1[6] = "img_06.gif";
    myImages1[7] = "img_07.gif";
    myImages1[8] = "img_08.gif";
    myImages1[9] = "img_09.gif";
var image = images[rand1];
document.randimg.src = "myImages1";
}

there is my html

<!DOCTYPE html>
<html>
 <head>
<title>mur</title>
 <link rel="stylesheet" href="style.css">
 <link rel="JavaScript" href="script.js">
</head>

<body onLoad="pickimg2">

    <div class="fenetre">

<a href="" onClick="pickimg();return false;"><img src="img_01.gif" name="randimg" border=0></a>

    </div>

</body>
</html>

If someone has another solution I'm open to it ! Thanks a lot !




Aucun commentaire:

Enregistrer un commentaire