Random image on refresh?

JavaScript
21

Just open scripts.js and add my code to the bottom of the file.
As we don’t want the code to fire until the page has finished loading and the elements that it references are available in the DOM, just wrap the call to the generate() method in $(document).ready(function(){});

E.g.

var randomImage = {
  paths: [
    "http://www.roflcat.com/images/cats/Vortex_Kitteh_Claims_Another.jpg",
    "http://nextgenfmradio.com/wp/wp-content/uploads/2012/09/iran-ballistic-missile-kitteh-600x480.jpg",
    "http://cdn.iwastesomuchtime.com/6242012164748iwsmt.jpeg"
  ],
  
  generate: function(){
    var path = randomImage.paths[Math.floor(Math.random()*randomImage.paths.length)];
    var img = new Image();
    img.src = path;
    $("#randomImage a").html(img);
    $("#randomImage a").attr("href", path);
  }
}

$(document).ready(function(){
  randomImage.generate();
});

That’s it :slight_smile:

22

Thanks will update my code. Thanks alot for helping me out with this. God day Pullo :slight_smile:

23

If i add the code it does not work somehow

24

Seems ok to me.
What error are you seeing (apart from one telling you not to hotlink to images :)) ?

25

I have updated the server (only index.html) random image is placed in custom.js. I am not that good with js and firebug yet - is all that is marked red an error that need to be fixed :slight_smile: ?

26

Sorry for the short reply, I’m about to go out.

In custom.js, you have:

...
    JQuery("#randomImage a").html(img);
    JQuery("#randomImage a").attr("href", path);
  }
}

JQuery(document).ready(function(){
...

“JQuery”, should be “jQuery”

27

Great thanks, that made it work. I want to make the image a link that goes to “http:www…”, how can i do that ?

Tried this <div id=“randomImage”><a href=“http://www.googe.com”></a></div>

28

Do you want the link to always go to the same place? If so, remove the statement that changes the href attribute.

29

Perfect, works great :smiley: Thanks Paul