Random Image JS Script, refresh/reloads 4 image w/rotation to next Ad Box

**giban** · 09-12-2008, 06:37 PM

Hello All,

To no avail can I find a script that would fit my site.

The script I need must have the following:

1) Load 4 random images on to 4 ad boxes at the top
2) Images changes on page reload or refresh
3) On page reload/refresh, a new image is loaded in ad box 1, image in ad box 1 moves into ad box 2, image on ad box 2 moves into ad box 4 ... and so forth.
4) The script must be an external script
5) The images must have a text, href link to site, on mouse over/click
6) The html code in the ad boxes must be keep to a minimum or refer to the external js script.
7) All image info such as URL, Text, image size are on the external js.script.

The above sounds complicated but I cannot find any script like it. I have tried others but they don't rotate on to the next ad box.

Here's a site that does what I am looking for:

http://www.runryder.com/?do=start&to...bot=1221226682

My webpage will have 4 image box at the top and another 4 image box at the footer. Refer to the html code below as to how I have the page layout:

HTML Code:

<head>
     <script type="text/javascript" src="http://nogocom/ads.js"> </script>
</head>

<Body>
     <div id="ad-wrapper">
          <div class="ad-1"> </div>   
          <div class="ad-2"> </div>   
          <div class="ad-3"> </div>   
          <div class="ad-4"> </div>   
     </div>


     <div id="maincontent">
          <p>Some Text Here</p>
     </div>


     <div id="ad-wrapper">
          <div class="ad-a"> </div>   
          <div class="ad-b"> </div>   
          <div class="ad-c"> </div>   
          <div class="ad-d"> </div>   
     </div>

</body>

**giban** · 09-18-2008, 09:13 PM

Is it possible or not?

**magicyte** · 09-18-2008, 09:16 PM

Here. Visit this page: http://www.dynamicdrive.com/forums/s...ad.php?t=33714. You can take excerpts of code for your little random add thing.

Yes. It is possible.

-magicyte

**giban** · 09-27-2008, 04:01 AM

OK after numerous google searches I finally found what I needed.

Thanks to the folks at this site:
http://javascript.internet.com/misce...andom-ads.html

Notes:

Code:

    * Created by: Michael Stransky
    * Web Site: http://www.stransky-webdesigns.com/
    * Posted: January 24, 2007

1. To show the ads vertically, change the script on the page to


<script type="text/javascript">
randomorder(adblock, '<br><br>')
</script>

2. To show the ads horizontally change the script on the page to


<script type="text/javascript">
randomorder(adblock, ' ')
</script>

3. The following portion of the code determines how many ads to display


var randomorder=new Array()
var the_one
var z=9
for (i=0;i<targetarray.length;i++)
randomorder[i]="i"

The value of the "z" variable is very important. If you have 20 ads but only want to display 4 ads at a time, you would change the value of the "z" variable to "z=16" (without the quotes). This means that out of 20 ads, 16 will be hidden.

Body

Code:

<p align="center">
<script type="text/javascript">
  randomorder(adblock, '<br><br>')
</script>
</p>

Head

Code:

<script type="text/javascript" src="randomAds.js"></script>

CSS

Code:

.imgBorder {
  border: none;
}

External JS

Code:

var adblock=new Array()
adblock[0]='<a href="http://www.jupitermedia.com/"><img src="http://www.jupitermedia.com/img/onlineMedia.jpg" class="imgBorder" alt="Jupitermedia"></a>'
adblock[1]='<a href="http://www.earthweb.com/"><img src="http://www.jupiterweb.com/img/erthweb-micro.gif" class="imgBorder" alt="Earthweb"></a>'
adblock[2]='<a href="http://www.internet.com/"><img src="http://www.jupiterweb.com/img/icom.gif" class="imgBorder" alt="internet.com"></a>'
adblock[3]='<a href="http://www.devx.com/"><img src="http://www.jupiterweb.com/img/devx-micro.gif" class="imgBorder" alt="DevX.com"></a>'
adblock[4]='<a href="http://www.graphics.com/"><img src="http://www.jupiterweb.com/img/graphicscom-micro.gif" class="imgBorder" alt="Graphics.com"></a>'
adblock[5]='<a href="http://www.jupiterwebcasts.com/"><img src="http://www.jupiterwebcasts.com/img/rd06/jwebcasts_logo.gif" width="165" height="22" class="imgBorder" alt="Jupiter Webcasts"></a>'
adblock[6]='<a href="http://www.webreference.com/"><img src="http://www.webreference.com/art/webref.gif" class="imgBorder" alt="Web Reference"></a>'
adblock[7]='<a href="http://webdeveloper.com/"><img src="http://www.webdeveloper.com/forum/images/webdev-logo2.gif" class="imgBorder" alt="Web Developer"></a>'
adblock[8]='<a href="http://www.scriptsearch.com/"><img src="http://www.scriptsearch.com/img/logo.gif" class="imgBorder" alt="Script Search"></a>'
adblock[9]='<a href="http://www.databasejournal.com/"><img src="http://www.databasejournal.com/img/logo.gif" width="153" height="55" class="imgBorder" alt="Database Journal"></a>'
adblock[10]='<a href="http://www.flashkit.com/"><img src="http://images2.flashkit.com/images/fk_logotop.gif" class="imgBorder"  alt="FlashKit"></a>'
adblock[11]='<a href="http://www.hiermenuscentral.com/"><img src="http://www.hiermenuscentral.com/img/hr-logo.gif" class="imgBorder" alt="HierMenus Central"></a>'
adblock[12]='<a href="http://www.4guysfromrolla.com/"><img src="http://www.4guysfromrolla.com/img/4guyslogo.gif" class="imgBorder" width="202" height="43" alt="4 Guys from Rolla"></a>'
adblock[13]='<a href="http://www.asp101.com/"><img src="http://www.asp101.com/img/asp_asp101_logo.gif" class="imgBorder" alt="ASP 101"></a>'


function randomorder(targetarray, spacing) {
  var randomorder=new Array()
  var the_one
  var z=11
  for (i=0;i<targetarray.length;i++)
  randomorder[i]=i

  while (z<targetarray.length) {
    the_one=Math.floor(Math.random()*targetarray.length)
    if (targetarray[the_one]!="_selected!"){
      document.write(targetarray[the_one]+spacing)
      targetarray[the_one]="_selected!"
      z++
    }
  }
}

**satty** · 11-18-2008, 12:54 PM

Hi.....
This site is really informative.....
Thanx.....

**dynamicforums** · 11-20-2008, 06:30 PM

this is really cool

**DonaldDarwood** · 11-26-2008, 07:32 AM

Hello All,

To no avail can I find a script that would fit my site.

The script I need must have the following:

1) Load 4 random images on to 4 ad boxes at the top
2) Images changes on page reload or refresh
3) On page reload/refresh, a new image is loaded in ad box 1, image in ad box 1 moves into ad box 2, image on ad box 2 moves into ad box 4 ... and so forth.
4) The script must be an external script
5) The images must have a text, href link to site, on mouse over/click
6) The html code in the ad boxes must be keep to a minimum or refer to the external js script.
7) All image info such as URL, Text, image size are on the external js.script.

The above sounds complicated but I cannot find any script like it. I have tried others but they don't rotate on to the next ad box.

Thread: Random Image JS Script, refresh/reloads 4 image w/rotation to next Ad Box

Thread Tools

Search Thread

Random Image JS Script, refresh/reloads 4 image w/rotation to next Ad Box

Script, refresh/reloads 4 image w/rotation to next Ad Box

Bookmarks

Bookmarks

Posting Permissions