vendredi 3 mars 2017

Need help creating Back button in random generate photo gallery

I made a image gallery that shows images randomly

Now I was only able to create a button for next but I need a back button also for the previous images

I used javascript for showing random images and now I can only generate next images. But i cannot create a back button for showing previously generated images Please help Thanks

<html>
<head>
<title>Image list</title>
<form name="imageForm">
  <table border=3>
   <tr align="center">
    <td>
      <input onclick="var temp = displayImage();displaynum(); return temp;"  type=button value="Click Here">
    </td>
  </tr>
  <tr>
    <td>
      <img src="http://ift.tt/2miQQBG" name="canvas" />
    </td>
  </tr>
  </table>
</form>
<script language="javascript">

var imagesArray = [
'http://ift.tt/2lCF2pD',
'http://ift.tt/2miLOVB',
'http://ift.tt/2lCyY0B',
'http://ift.tt/2miVUG2',
'http://ift.tt/2lCwsr9',
'http://ift.tt/2miQxqc',
'http://ift.tt/2lCxpzq',
'http://ift.tt/2miR6At',
'http://ift.tt/2lCAKhZ',
'http://ift.tt/2miLiXN',
];

var usedImages = {};
var usedImagesCount = 0;


function displayImage(){

    var num = Math.floor(Math.random() * (imagesArray.length));
    if (!usedImages[num]){
        document.canvas.src = imagesArray[num];
        usedImages[num] = true;
        if (usedImagesCount === imagesArray.length){
            usedImagesCount = 0;
            usedImages = {};
        }
    } else {
        displayImage();
                displaynum();
    }
        

}



</script>
</html>



Aucun commentaire:

Enregistrer un commentaire