CODEWITHSUNDEEP
javascripthtml
SA__
SA__

Reputation: 437

Generating random image url in javascript

I am generating random numbers and appending with the previous variable and trying to get the value of images. but also the random number only generated. How can I do this ?

Here's my code

var img1 = 'http://i.imgur.com/8olCb1Qb.jpg';
var img2= 'http://i.imgur.com/usJWgL7b.jpg';
var img3 = 'http://i.imgur.com/kxsLXb8b.jpg';
var img4 = 'http://i.imgur.com/XQbcjvUb.jpg';
var img5 = 'http://i.imgur.com/j3CVSSMb.jpg';
var img6 = 'http://i.imgur.com/BQNvBVib.jpg';
var img7 = 'http://i.imgur.com/DZq0ORlb.jpg';
var img8 = 'http://i.imgur.com/t73Tvlqb.jpg';
var img9 = 'http://i.imgur.com/Y8iFltdb.jpg';
var img10 = 'http://i.imgur.com/u3sBUMjb.jpg';
var no = Math.floor(Math.random() * 6) + 1
var img = 'img'+no;
console.log(img)

I prefer only javascript.

Upvotes: 2

Views: 3395

Answers (5)

Ruan Mendes
Ruan Mendes

Reputation: 92324

As suggested by others, dynamic variable names are kind of ugly. You should use an array.

var imgs = ['a', 'b', 'c'];
var randomImg = imgs[Math.floor(Math.random() * imgs.length);

If you really want to use dynamic names, you should attach them to an object, not just free standing variables.

var imgs = {img1: 'a', img2: 'b', img3: 'c'};
var no = Math.floor(Math.random() * 3) + 1:
var img = imgs['img' + no];

Upvotes: 1

pheroMona13
pheroMona13

Reputation: 472

if you don't want to put your images in an array, you can call them like this:

var img1 = 'http://i.imgur.com/8olCb1Qb.jpg';
var img2= 'http://i.imgur.com/usJWgL7b.jpg';
var img3 = 'http://i.imgur.com/kxsLXb8b.jpg';
var img4 = 'http://i.imgur.com/XQbcjvUb.jpg';
var img5 = 'http://i.imgur.com/j3CVSSMb.jpg';
var img6 = 'http://i.imgur.com/BQNvBVib.jpg';
var img7 = 'http://i.imgur.com/DZq0ORlb.jpg';
var img8 = 'http://i.imgur.com/t73Tvlqb.jpg';
var img9 = 'http://i.imgur.com/Y8iFltdb.jpg';
var img10 = 'http://i.imgur.com/u3sBUMjb.jpg';
var no = Math.floor(Math.random() * 6) + 1
var img = 'img'+no;
console.log(window[img])
// or 
console.log(this[img])

Upvotes: 0

GottZ
GottZ

Reputation: 4947

well. arrays are fun. you should use them.

var images = ["8olCb1Qb", "usJWgL7b", "kxsLXb8b", "XQbcjvUb", "j3CVSSMb", "BQNvBVib", "DZq0ORlb", "t73Tvlqb", "Y8iFltdb", "u3sBUMjb"];
var randomPick = images[Math.random() * images.length | 0];
var url = "http://i.imgur.com/" + randomPick + ".jpg";
document.body.appendChild(new Image()).src = url;

Upvotes: 1

Victor Bychek
Victor Bychek

Reputation: 56

I think you want to select random images

var images = [
    'http://i.imgur.com/8olCb1Qb.jpg',
    'http://i.imgur.com/usJWgL7b.jpg',
    'http://i.imgur.com/kxsLXb8b.jpg',
    'http://i.imgur.com/XQbcjvUb.jpg',
    'http://i.imgur.com/j3CVSSMb.jpg',
    'http://i.imgur.com/BQNvBVib.jpg',
    'http://i.imgur.com/DZq0ORlb.jpg',
    'http://i.imgur.com/t73Tvlqb.jpg',
    'http://i.imgur.com/Y8iFltdb.jpg',
    'http://i.imgur.com/u3sBUMjb.jpg'
];
var random = images[Math.floor(Math.random() * images.length)];

Upvotes: 4

Farzin Kanzi
Farzin Kanzi

Reputation: 3435

Put your images in a div named div divImages.

var img=$('#divImages').children().eq(no);

And if you don't want using jquery the javascript is:

var img = document.getElementById('#divImages').children[no];

Upvotes: 0

Related Questions