1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Random iframe onload as fullscreen background

Discussion in 'JavaScript' started by 7643sfsag6, Jan 27, 2016.

0
  1. #1
    Hi all, I have looked all over but cant seem to find how to do this:

    Basically I would like to have an iframe that is my background as fullscreen behind everything.

    The "src" of the iframe I would like to randomly change onload. I think I will have about 3 or 4 sources.

    This is what I have thus far, but nothing is working!!!

    Any ideas?

    <!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <script>
function getRandomUrl(urls) {
    var minIndex = 0;
    var maxIndex = urls.length - 0.5;
    var randomIndex = Math.floor(Math.random() * (maxIndex - minIndex)) + minIndex;
    return urls[randomIndex];
}

var urls = [
"http://www.7-zip.org/",
"http://www.win-rar.com/",
"http://www.winzip.com/"];

var randomSelectedUrl = getRandomUrl(urls);

$("#vitrine").html(
"<iframe class='random-iframe' src='" + randomSelectedUrl + "' width='100%' height='100%' frameborder='0' scrolling='yes' seamless='seamless'></iframe>");
</script>
<style>
iframe.random-iframe { display: none; }
vitrine {
    text-align: center;
    width: 100%;
    vertical-align: middle;
    height: 100%;
    display: table-cell;
}
.iframe{
  width: 200px;
}
div,
body,
html {
    height: 100%;
    width: 100%;
}
body{
    display: table;
}

</head>
<body>
<div id="vitrine"></div>
<iframe class="random-iframe" src="http://www.winzip.com/" width="100%" height="700" frameborder="0" scrolling="yes" seamless="seamless"></iframe>
</body>
</html>
    Code (markup):

     
    7643sfsag6, Jan 27, 2016 IP
  2. 7643sfsag6

    7643sfsag6 Member

    Messages:
    58
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    43
    #2
    ok done,

    was missing some schoolboy errors


    <html>
<head>
<script src="https://code.jquery.com/jquery-2.1.1.js"></script>
<style>
vitrine {
    text-align: center; width: 100%; vertical-align: middle;height: 100%; display: table-cell;}
div,
body,
html {height: 100%; width: 100%;}
</style>
</head>

<body>
<div id="vitrine"></div>

<script>
function getRandomUrl(urls) {
    var minIndex = 0;
    var maxIndex = urls.length - 0.5;
    var randomIndex = Math.floor(Math.random() * (maxIndex - minIndex)) + minIndex;
    return urls[randomIndex];
}
var urls = [
"http://www.7-zip.org/",
"http://www.win-rar.com/",
"http://www.winzip.com/"];

var randomSelectedUrl = getRandomUrl(urls);

$("#vitrine").html(
"<iframe class='random-iframe' src='" + randomSelectedUrl + "' width='100%' height='100%' frameborder='0' scrolling='no' seamless='seamless'></iframe>");
</script>
</body>
</html>
    Code (markup):
     
    7643sfsag6, Jan 28, 2016 IP