topical media & game development

topical media & game development
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _
graphic-javascript-effect-link-change-effect.htm / htm

  
  <!-- ONE STEP TO INSTALL TIME-BASE LINK ROTATION:
  
    1.  Copy the coding into the BODY of your HTML document  -->
  
  <!-- STEP ONE: Paste this code into the BODY of your HTML document  -->
  
  <BODY>
  
  <!-- This script and many more are available free online at -->
  
  <!-- The JavaScript Source!! http://javascript.internet.com -->
  
  <!-- Original:  Patrick Lewis  (gtrwiz-NOSPAM@aol.com) -->
  
  <!-- Web Site:  http://www.PatrickLewis.net -->
  
  <center>
  
  <form name=Rotate>
  
  This script will rotate through an Array of 10 links/images<br> 
  
  based when the PageLoads or the current time (dynamic).<br>
  
  This script will work on MSIE 4+ and Netscape 6+ browsers.   
  
  <br>
  
  <br>
  
  <table bgcolor=#6699FF border=0 cellspacing=2 cellpadding=5 >
  
  <tr bgcolor=#99ccFF><th colspan=6>Time based link or image rotation - v1.0</th></tr>
  
  <SCRIPT LANGUAGE="JavaScript">
  
  <!-- Begin
  
  linksNAME = new Array("Link 1","Link 2","Link 3","Link 4","Link 5","Link 6","Link 7","Link 8","Link 9","Link 10");
  
  linksURL = new Array("#1","#2","#3","#4","#5","#6","#7","#8","#9","#10");
  
  linksIMG = new Array("1","2","3","4","5","6","7","8","9","0");
  
  ImgPath = "http://www.patricklewis.net/games/images/a";
  
  days = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
  
  year = new Date().getYear()/4;
  
  if (year.toString().indexOf(".") == -1)  // ## Leap year check
  
          {days[1] = 29;}
  
  //     BEGIN PAGE LOAD SECTION


  
  day = new Date().getDay();
  
  hour = new Date().getHours();
  
  minute = new Date().getMinutes();
  
  second = new Date().getSeconds();
  
  date = new Date().getDate();
  
  month = new Date().getMonth();
  
  FirstDay = new Date(new Date().getYear(), 0, 1).getDay();
  
  zdays=0;
  
  for (kk=0;kk<month;kk++)
  
          {zdays += days[kk];}
  
  week = Math.floor((zdays + FirstDay + date)/7);
  
  //     END PAGE LOAD SECTION


  
  //     BEGIN DYNAMIC SECTION


  
  function AutoRotate() {
  
  day = new Date().getDay();
  
  hour = new Date().getHours();
  
  minute = new Date().getMinutes();
  
  second = new Date().getSeconds();
  
  date = new Date().getDate();
  
  month = new Date().getMonth();
  
  FirstDay = new Date(new Date().getYear(), 0, 1).getDay();
  
  zdays=0;
  
  for (kk=0;kk<month;kk++)
  
          {zdays += days[kk];}
  
  week = Math.floor((zdays + FirstDay + date)/7);
  
  //   BEGIN VARIABLE CHANGER


  
  //   GOING BY SECONDS


  
  ChangeNow = document.Rotate.VSTime[document.Rotate.VSTime.selectedIndex].value;
  
  VSchange = second/ChangeNow;
  
  if (VSchange.toString().indexOf(".") == -1) {
  
          document.Rotate.VS.src = ImgPath + linksIMG[VSchange % linksIMG.length] +'.gif'
  
          LinkUpdate("VSLink",'<a href='+ linksURL[VSchange % linksURL.length] + '>'+ linksNAME[VSchange % linksNAME.length] +'</a>');
  
          }
  
  //   END VARIABLE CHANGER


  
  document.Rotate.Dtime.value = new Date();
  
  document.Rotate.SM.src = ImgPath + linksIMG[second % linksIMG.length] +'.gif'
  
  LinkUpdate("SMLink",'<a href='+ linksURL[second % linksURL.length] + '>'+ linksNAME[second % linksNAME.length] +'</a>');
  
  document.Rotate.MH.src = ImgPath + linksIMG[minute % linksIMG.length] +'.gif'
  
  LinkUpdate("MHLink",'<a href='+ linksURL[minute % linksURL.length] + '>'+ linksNAME[minute % linksNAME.length] +'</a>');
  
  document.Rotate.HD.src = ImgPath + linksIMG[hour % linksIMG.length] +'.gif'
  
  LinkUpdate("HDLink",'<a href='+ linksURL[hour % linksURL.length] + '>'+ linksNAME[hour % linksNAME.length] +'</a>');
  
  document.Rotate.DW.src = ImgPath + linksIMG[day % linksIMG.length] +'.gif'
  
  LinkUpdate("DWLink",'<a href='+ linksURL[day % linksURL.length] + '>'+ linksNAME[day % linksNAME.length] +'</a>');
  
  document.Rotate.DM.src = ImgPath + linksIMG[date % linksIMG.length] +'.gif'
  
  LinkUpdate("DMLink",'<a href='+ linksURL[date % linksURL.length] + '>'+ linksNAME[date % linksNAME.length] +'</a>');
  
  document.Rotate.WY.src = ImgPath + linksIMG[week % linksIMG.length] +'.gif'
  
  LinkUpdate("WYLink",'<a href='+ linksURL[week % linksURL.length] + '>'+ linksNAME[week % linksNAME.length] +'</a>');
  
  document.Rotate.MY.src = ImgPath + linksIMG[month % linksIMG.length] +'.gif'
  
  LinkUpdate("MYLink",'<a href='+ linksURL[month % linksURL.length] + '>'+ linksNAME[month % linksNAME.length] +'</a>');
  
  setTimeout("AutoRotate();",1000);
  
  }
  
  function LinkUpdate(LinkId,text) {
  
  if (document.all) {document.all[LinkId].innerHTML = text;}
  
  else if (document.getElementById) {document.getElementById(LinkId).innerHTML = text;}
  
  //     END DYNAMIC SECTION


  
  }
  
  // ##  Current time-date
  
  document.write('<tr bgcolor=#99ccFF><td colspan=6 nowrap><center>Pageload: '+ new Date() +
  
          '       Dynamic: <input type=text id=Dtime size=30></th></tr>');
  
  // ##  RANGES
  
  document.write('<tr bgcolor=#99ccFF>'+
  
          '<th rowspan=2 width=75>Range</th>'+
  
          '<th rowspan=2 width=160>Link changes every</th>'+
  
          '<th width=140 colspan=2>Link</th>'+
  
          '<th width=140 colspan=2>Images</th></tr>'+
  
          '<tr bgcolor=#99ccFF><th>Pageload</th><th>Dynamic</th><th>Pageload</th><th>Dynamic</th></tr>');
  
  // ##  second of the minute
  
  document.write('<tr bgcolor=#88bbFF>'+
  
          '<td>60</td>'+
  
          '<td width=150>Second of the minute</td>'+
  
          '<td><a href='+ linksURL[second % linksURL.length] + '>'+ linksNAME[second % linksNAME.length] +'</a></td>'+
  
          '<td><div id=SMLink></div></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[second % linksIMG.length] +'.gif" border=0></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[second % linksIMG.length] +'.gif" id="SM" border=0></td></tr>');
  
  // ##  minute of the hour
  
  document.write('<tr bgcolor=#88bbFF>'+
  
          '<td>60</td>'+
  
          '<td>Minute of the hour</td>'+
  
          '<td><a href='+ linksURL[minute % linksURL.length] + '>'+ linksNAME[minute % linksNAME.length] +'</a></td>'+
  
          '<td><div id=MHLink></div></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[minute % linksIMG.length] +'.gif" border=0></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[minute % linksIMG.length] +'.gif" id="MH" border=0></td></tr>');
  
  // ##  hour of the day - 24 hour
  
  document.write('<tr bgcolor=#88bbFF>'+
  
          '<td>24</td>'+
  
          '<td>Hour of the day</td>'+
  
          '<td><a href='+ linksURL[hour % linksURL.length] + '>'+ linksNAME[hour % linksNAME.length] +'</a></td>'+
  
          '<td><div id=HDLink></div></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[hour % linksIMG.length] +'.gif" border=0></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[hour % linksIMG.length] +'.gif" id="HD" border=0></td></tr>');
  
  // ##  day of the week
  
  document.write('<tr bgcolor=#88bbFF>'+
  
          '<td>7</td>'+
  
          '<td>Day of the week</td>'+
  
          '<td><a href='+ linksURL[day % linksURL.length] + '>'+ linksNAME[day % linksNAME.length] +'</a></td>'+
  
          '<td><div id=DWLink></div></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[day % linksIMG.length] +'.gif" border=0></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[day % linksIMG.length] +'.gif" id="DW" border=0></td></tr>');
  
  // ##  day of the month
  
  document.write('<tr bgcolor=#88bbFF>'+
  
          '<td>28-31</td>'+
  
          '<td>Day of the month</td>'+
  
          '<td><a href='+ linksURL[date % linksURL.length] + '>'+ linksNAME[date % linksNAME.length] +'</a></td>'+
  
          '<td><div id=DMLink></div></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[date % linksIMG.length] +'.gif" border=0></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[date % linksIMG.length] +'.gif" id="DM" border=0></td></tr>');
  
  // ##  week of the year
  
  document.write('<tr bgcolor=#88bbFF>'+
  
          '<td>52</td>'+
  
          '<td>Week of the year</td>'+
  
          '<td><a href='+ linksURL[week % linksURL.length] + '>'+ linksNAME[week % linksNAME.length] +'</a></td>'+
  
          '<td><div id=WYLink></div></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[week % linksIMG.length] +'.gif" border=0></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[week % linksIMG.length] +'.gif" id="WY" border=0></td></tr>');
  
  // ##  month of the year
  
  document.write('<tr bgcolor=#88bbFF>'+
  
          '<td>12</td>'+
  
          '<td>Month of the year</td>'+
  
          '<td><a href='+ linksURL[month % linksURL.length] + '>'+ linksNAME[month % linksNAME.length] +'</a></td>'+
  
          '<td><div id=MYLink></div></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[month % linksIMG.length] +'.gif" border=0></td>'+
  
          '<td><img src="'+ ImgPath + linksIMG[month % linksIMG.length] +'.gif" id="MY" border=0></td></tr>');
  
  // End -->
  
  </SCRIPT>
  
  <tr bgcolor=#88bbFF>
  
          <td>Every <select name="VSTime">
  
                  <option value=1 selected>        1
  
                  <option value=2>        2
  
                  <option value=4>        4
  
                  <option value=5>        5
  
                  <option value=10>        10
  
                  </select></td>
  
          <td>Variable seconds<br>Dynamic only</td>
  
          <td></td>
  
          <td><div id=VSLink></div></td>
  
          <td></td>
  
          <td><img src="http://www.patricklewis.net/games/images/3.gif" id="VS" border=0></td>
  
  </tr>
  
  <tr><th colspan=6>Note: Weeks are Sunday-Saturday<br>
  
          More options and updates available at <a href="http://www.PatrickLewis.net/javascript">www.PatrickLewis.net/javascript</a>.</th></tr>
  
  </table>
  
  </form>
  
  <p><center>
  
  <font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
  
  by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
  
  </center><p>
  
  <!-- Script Size:  9.97 KB -->
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _
You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.