Let's say I have a banner on my site that randomly rotates between images that depict the month of January. Is it possible to have 10 images randomly rotate the entire month, then to have a new 10 images rotate randomly for the following month? I also need each image to link to its link.

I was thinking an If/Then statement might work, but I have no clue... and frankly, I'm not a very good coder.

IF MONTH=January, then show this

<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="" 
imagelinks[2]="" 
imagelinks[3]="" 
imagelinks[4]="" 
imagelinks[5]="" 
imagelinks[6]="" 
imagelinks[7]="" 
imagelinks[8]="" 
imagelinks[9]="" 
imagelinks[10]="" 





var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>



IF MONTH=February, then show this

<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="" 
imagelinks[2]="" 
imagelinks[3]="" 
imagelinks[4]="" 
imagelinks[5]="" 
imagelinks[6]="" 
imagelinks[7]="" 
imagelinks[8]="" 
imagelinks[9]="" 
imagelinks[10]="" 





var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>

Dani AI

Generated

Nice progress from — the repeated-div + date-range approach works, but it can be simplified and made safer. Rather than many hidden divs and repeated inline scripts, pick the current month with JavaScript and keep one banner container. Store each month as an array of small objects (src, href, alt). That removes fragile string-concatenation of HTML, avoids document.write, keeps image/link pairs in sync, and makes maintenance trivial.

Example (place one small placeholder div where the banner should go):

<div id="monthly-banner"></div>

<script>
(function(){
  var imageSets = {
    0: [ {src:'images/jan1.png', href:'/snowparty', alt:'Snow event'},
         {src:'images/jan2.png', href:'/jan-calendar', alt:'January calendar'} ],
    1: [ {src:'images/feb1.png', href:'/valentine', alt:'Valentine special'} ],
    default: [ {src:'images/default.png', href:'/', alt:'Default banner'} ]
  };

  var month = new Date().getMonth(); // 0 = January
  var set = imageSets[month] || imageSets.default;
  var pick = set[Math.floor(Math.random() * set.length)];

  var img = new Image(); img.src = pick.src; // preload
  var container = document.getElementById('monthly-banner');
  if (container) {
    var a = document.createElement('a');
    a.href = pick.href;
    var i = document.createElement('img');
    i.src = pick.src; i.alt = pick.alt || '';
    a.appendChild(i);
    container.appendChild(a);
  }
})();
</script>

Notes and gotchas: do not rely on client-side time when a strict server timezone is required — in that case render the correct set server-side. Always include meaningful alt text for accessibility, use responsive images or srcset for mobile, and choose a safe place to manage the month-to-images mapping (JSON file or CMS if frequent updates are needed). 's slider suggestion is useful if a prebuilt carousel is wanted; the same month-selection trick can load the slider's image list.

Recommended Answers

All 5 Replies

Maybe this might help. I have a code that displays a different phrase based on the day of the week. What I'd need is for it to display a different random image array formula every month instead. Is this even possible?

<font style="font-weight:bold; color:#990000; font-size:22px"><script type="text/javascript"> 
    <!--      
    Date.prototype.getWeek = function() {
        var onejan = new Date(this.getFullYear(),0,1);
        return Math.ceil((((this - onejan) / 86400000) + onejan.getDay()+1)/7);
    } 

    var weekNumber = (new Date()).getWeek();

    // Array of day names
    var dayNames = new Array(
    "It's Sunday, start the week off strong!",
    "Mondays are tough, but work through it!",
     "It's Tuesday, time to step it up!",
     "It's Wednesday. Halfway through, so work twice as hard!",
     "Thursday's here, keep up the great work!",
     "It's Friday, right? You must want it bad!",
    "It's Saturday. Finish this week STRONG!");
    var now = new Date();
    document.write (dayNames[now.getDay()]);

     // -->
</script></font><br><br><br><br>

I believe I'm extremely close to figuring this out by myself. If anyone would like to chime in, please do so. I am no pro; just trying to put random pieces of a puzzle together from stuff I find through google. Thanks.

<div id = "div1" style = "display:none">January</div>
<div id = "div2" style="display:none">February</div>
<div id = "div3" style="display:none">March</div>
<div id = "div4" style = "display:none">April</div>
<div id = "div5" style="display:none">May</div>
<div id = "div6" style="display:none">June</div>
<div id = "div7" style = "display:none">July</div>
<div id = "div8" style="display:none">August</div>
<div id = "div9" style="display:none">September</div>
<div id = "div10" style = "display:none">October</div>
<div id = "div11" style="display:none">November</div>
<div id = "div12" style="display:none">December</div>

<script type = "text/javascript">


var startEventDate = new Date("January 1, 2014"); // time is optional 
var endEventDate = new Date ("February 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div1").style.display = "block"}

var startEventDate = new Date("February 1, 2014"); // time is optional 
var endEventDate = new Date ("March 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div2").style.display = "block"}

var startEventDate = new Date("March 1, 2014"); // time is optional 
var endEventDate = new Date ("April 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div3").style.display = "block"}

var startEventDate = new Date("April 1, 2014"); // time is optional 
var endEventDate = new Date ("May 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div4").style.display = "block"}

var startEventDate = new Date("May 1, 2014"); // time is optional 
var endEventDate = new Date ("June 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div5").style.display = "block"}

var startEventDate = new Date("June 1, 2014"); // time is optional 
var endEventDate = new Date ("July 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div6").style.display = "block"}

var startEventDate = new Date("July 1, 2014"); // time is optional 
var endEventDate = new Date ("August 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div7").style.display = "block"}

var startEventDate = new Date("August 1, 2014"); // time is optional 
var endEventDate = new Date ("September 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div8").style.display = "block"}

var startEventDate = new Date("September 1, 2014"); // time is optional 
var endEventDate = new Date ("October 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div9").style.display = "block"}

var startEventDate = new Date("October 1, 2014"); // time is optional 
var endEventDate = new Date ("November 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div10").style.display = "block"}

var startEventDate = new Date("November 1, 2014"); // time is optional 
var endEventDate = new Date ("December 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div11").style.display = "block"}

var startEventDate = new Date("December 1, 2014"); // time is optional 
var endEventDate = new Date ("January 1, 2015");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div12").style.display = "block"}




</script>

That seemed to had did the trick! Here's what I've come up with for anyone who might ever need this or for anyone who would like to clean it up for me a bit.

<div id = "div1" style = "display:none">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div2" style = "display:none">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div3" style = "display:none">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div4" style = "display:none">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div5" style = "display:none">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div6" style = "display:none">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div7" style = "display:none">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div8" style = "display:none">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div9" style = "display:none">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div10" style = "display:none">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div11" style = "display:none">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div12" style = "display:none">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>

















<script type = "text/javascript">


var startEventDate = new Date("January 1, 2014"); // time is optional 
var endEventDate = new Date ("February 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div1").style.display = "block"}

var startEventDate = new Date("February 1, 2014"); // time is optional 
var endEventDate = new Date ("March 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div2").style.display = "block"}

var startEventDate = new Date("March 1, 2014"); // time is optional 
var endEventDate = new Date ("April 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div3").style.display = "block"}

var startEventDate = new Date("April 1, 2014"); // time is optional 
var endEventDate = new Date ("May 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div4").style.display = "block"}

var startEventDate = new Date("May 1, 2014"); // time is optional 
var endEventDate = new Date ("June 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div5").style.display = "block"}

var startEventDate = new Date("June 1, 2014"); // time is optional 
var endEventDate = new Date ("July 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div6").style.display = "block"}

var startEventDate = new Date("July 1, 2014"); // time is optional 
var endEventDate = new Date ("August 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div7").style.display = "block"}

var startEventDate = new Date("August 1, 2014"); // time is optional 
var endEventDate = new Date ("September 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div8").style.display = "block"}

var startEventDate = new Date("September 1, 2014"); // time is optional 
var endEventDate = new Date ("October 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div9").style.display = "block"}

var startEventDate = new Date("October 1, 2014"); // time is optional 
var endEventDate = new Date ("November 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div10").style.display = "block"}

var startEventDate = new Date("November 1, 2014"); // time is optional 
var endEventDate = new Date ("December 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div11").style.display = "block"}

var startEventDate = new Date("December 1, 2014"); // time is optional 
var endEventDate = new Date ("January 1, 2015");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div12").style.display = "block"}




</script>

I guess I also needed to state an option for the blank state.

<div id = "div1" style = "display:none;">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div2" style = "display:none;">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div3" style = "display:none;">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div4" style = "display:none;">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div5" style = "display:none;">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div6" style = "display:none;">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div7" style = "display:none;">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div8" style = "display:none;">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div9" style = "display:none;">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div10" style = "display:none;">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div11" style = "display:none;">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>






<div id = "div12" style = "display:none;">
<center><script language="JavaScript">
<!--

function random_imglink(){
var myimages=new Array()
//specify random images below. You can have as many as you wish

myimages[1]=""
myimages[2]=""
myimages[3]=""
myimages[4]=""
myimages[5]=""
myimages[6]=""
myimages[7]=""
myimages[8]=""
myimages[9]=""
myimages[10]=""
myimages[11]=""


//specify corresponding links below
var imagelinks=new Array()

imagelinks[1]="http://bookeo.com/50allstars?category=211LFU3TR14431C7D5F1&initialview=oneOffEvents" 
imagelinks[2]="http://bookeo.com/50allstars?type=2119U69N413C41D1441E" 
imagelinks[3]="http://bookeo.com/50allstars?category=211UPY7TC13FF8F78C00&initialview=oneOffEvents" 
imagelinks[4]="http://www.50allstars.com/p/media.html" 
imagelinks[5]="http://bookeo.com/50allstars?type=2117JHM7A14137B466D8" 
imagelinks[6]="http://www.50allstars.com/p/donate.html" 
imagelinks[7]="http://www.50allstars.com/p/shop.html" 
imagelinks[8]="http://www.50allstars.com/p/challenge.html" 
imagelinks[9]="http://www.50allstars.com/2014/08/teams.html" 
imagelinks[10]="http://www.50allstars.com/p/calendar-sync.html" 
imagelinks[11]="http://bookeo.com/50allstars" 


var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
document.write('<a href='+'"'+imagelinks[ry]+'"'+'><img src="'+myimages[ry]+'" style="border:4px #660000 solid;"></a>')
}
random_imglink()
//-->
</script></center>
</div>





<div id = "space" style = "display:none;">
</div>











<script type = "text/javascript">


var today = new Date();
var endofseason = new Date("January 1, 2014");
if (today >= endofseason) {document.getElementById("space").style.display = "block"} 

var startEventDate = new Date("January 1, 2014"); // time is optional 
var endEventDate = new Date ("February 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div1").style.display = "block"}

var startEventDate = new Date("February 1, 2014"); // time is optional 
var endEventDate = new Date ("March 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div2").style.display = "block"}

var startEventDate = new Date("March 1, 2014"); // time is optional 
var endEventDate = new Date ("April 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div3").style.display = "block"}

var startEventDate = new Date("April 1, 2014"); // time is optional 
var endEventDate = new Date ("May 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div4").style.display = "block"}

var startEventDate = new Date("May 1, 2014"); // time is optional 
var endEventDate = new Date ("June 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div5").style.display = "block"}

var startEventDate = new Date("June 1, 2014"); // time is optional 
var endEventDate = new Date ("July 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div6").style.display = "block"}

var startEventDate = new Date("July 1, 2014"); // time is optional 
var endEventDate = new Date ("August 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div7").style.display = "block"}

var startEventDate = new Date("August 1, 2014"); // time is optional 
var endEventDate = new Date ("September 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div8").style.display = "block"}

var startEventDate = new Date("September 1, 2014"); // time is optional 
var endEventDate = new Date ("October 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div9").style.display = "block"}

var startEventDate = new Date("October 1, 2014"); // time is optional 
var endEventDate = new Date ("November 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div10").style.display = "block"}

var startEventDate = new Date("November 1, 2014"); // time is optional 
var endEventDate = new Date ("December 1, 2014");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div11").style.display = "block"}

var startEventDate = new Date("December 1, 2014"); // time is optional 
var endEventDate = new Date ("January 1, 2015");
if ((today >= startEventDate)  && (today <=endEventDate)) {document.getElementById("div12").style.display = "block"}




</script>

Have a look at this: http://www.javascriptkit.com/script/script2/jsslide.shtml

Get it up and running, and then change the following lines:

//configure the paths of the images, plus corresponding target links
var currentMonth = (new Date).getMonth() + 1;
if(currentMonth == 10){
    slideshowimages('http://upload.wikimedia.org/wikipedia/commons/thumb/a/ab/Logo-ubuntu_cof-orange-hex.svg/100px-Logo-ubuntu_cof-orange-hex.svg.png', '')
    slideshowlinks("http://food.epicurious.com/run/recipe/view?id=13285","http://food.epicurious.com/run/recipe/view?id=10092")
}else if(currentMonth == 11){
    slideshowimages('http://www.javascriptkit.com/script/script2/photo1.jpg', 'http://www.javascriptkit.com/script/script2/photo2.jpg')
    slideshowlinks("http://food.epicurious.com/run/recipe/view?id=13285","http://food.epicurious.com/run/recipe/view?id=10092")
}

It's hardly a perfect script, but does what you need. The same method can be used with far more complex plugins, just change the list of images depending on what the month is (although it's more complicated in big sliders).

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.