Results 1 to 2 of 2

Thread: Random Image with link

  1. #1
    Join Date
    Nov 2013

    Random Image with link

    I an new here and quite a novice at coding but I have the following code:
    var myPix = ["images/cia.jpg" , "images/mafia.jpg","images/johnson.jpg" , "images/cuba.jpg" ,"images/oswald.jpg" ];
    function randomPic() {
    		var randomNum = Math.floor((Math.random() * myPix.length));
    		document.getElementById("myPix").src = myPix[randomNum];
    on the html document I have this:

    HTML Code:
    <div id = "randomPic"><img  src="images/cia.jpg" width="305" height="312" id="myPix" /></div>

    How can I make it so that each image also acts as a hyperlink to a page?
    I have looked at examples around the net and modified the code to no avail.
    I have tried using different browsers.

    I have also tried doing this:

    var myPix = new Array();
    	myPix[0] = '<a href="a.html"><img src = "images/cia.jpg" ></a>';
    	myPix[1] = '<a href="b.html"><img src = "image/mafia.jpg" ></a>';
    	myPix[2] = '<a href="c.html"><img src = "images/johnson.jpg" ></a>';
    	myPix[3] = '<a href="d.html"><img src = "images/cuba.jpg" ></a>';
    	myPix[4] = '<a href="e.html"><img src = "images/oswald.jpg" ></a>';
    but still nothing.

  2. #2
    Join Date
    May 2006
    Somewhere behind your screen
    <!DOCTYPE html>
    <meta charset="utf-8" />
    var mypix=[
    function showImg(){
    var index=Math.floor((Math.random() * mypix.length));
    document.getElementById('content').innerHTML='<a href="'+mypix[index][1]+'"><img src="'+mypix[index][0]+'" width="300" height="300" alt="'+mypix[index][0]+'" /></a><br /><br />link: '+mypix[index][1]+'<br />src: '+mypix[index][0];
    <div id="content"></div>
    Last edited by Padonak; 11-27-2013 at 12:30 PM.
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
HTML5 Development Center

Recent Articles