I am trying to load a random video on page load. This is some javascript that I threw together that I thought might work. I'm not that familiar with javascript, so there might be a much easier way to do this... Any ideas?

function random_video {

    var string1 = '<div class="span4"><h3 class="meet">Meet the Makers</h3><iframe width="100%" height="200" src="" frameborder="0" allowfullscreen></iframe></div>';

    var string2 = '<div class="span4"><h3 class="meet">Meet the Makers</h3><iframe width="100%" height="200" src="" frameborder="0" allowfullscreen=""></iframe></div>';

    var string3 = '<div class="span4"><h3 class="meet">Meet the Makers</h3><iframe width="100%" height="200" src="" frameborder="0" allowfullscreen=""></iframe></div>';

    var number = Math.floor((Math.random()*3)+1);

    if ( number == 1) {
      document.write(string1);
    } else ( number == 2 ) {
        document.write(string2);
    } else ( number == 3 ) {
        document.write(string3);
    }

};

I am trying to load a random video on page load. This is some javascript that I threw together that I thought might work. I'm not that familiar with javascript, so there might be a much easier way to do this... Any ideas?

function random_video {

    var string1 = '<div class="span4"><h3 class="meet">Meet the Makers</h3><iframe width="100%" height="200" src="http://www.youtube./embed/Ig-DbfPoz3o" frameborder="0" allowfullscreen></iframe></div>';

    var string2 = '<div class="span4"><h3 class="meet">Meet the Makers</h3><iframe width="100%" height="200" src="http://www.youtube./embed/estPhyfBGho" frameborder="0" allowfullscreen=""></iframe></div>';

    var string3 = '<div class="span4"><h3 class="meet">Meet the Makers</h3><iframe width="100%" height="200" src="http://www.youtube./embed/6JL4hpnZklk" frameborder="0" allowfullscreen=""></iframe></div>';

    var number = Math.floor((Math.random()*3)+1);

    if ( number == 1) {
      document.write(string1);
    } else ( number == 2 ) {
        document.write(string2);
    } else ( number == 3 ) {
        document.write(string3);
    }

};

• javascript
• html

• 1 Your if/else condition needs some more ifs (e.g. else if(...). – j08691 Commented Apr 9, 2012 at 21:17
• Does this answer your question? play random video on each visit/refresh with iFrame javascript – edo9k Commented Feb 19, 2024 at 18:28

1 Answer 1

Would be more generalizable and easier to add more videos if you use an Array:

var videos = [
    'Ig-DbfPoz3o',
    'estPhyfBGho',
    '6JL4hpnZklk'
];

var index=Math.floor(Math.random() * videos.length);
var html='<div class="span4"><h3 class="meet">Meet the Makers</h3><iframe width="100%" height="200" src="http://www.youtube./embed/' + videos[index] + '" frameborder="0" allowfullscreen></iframe></div>';
document.write(html);