Solved

Revolving Graphics (Banner Ads)

Posted on 2004-08-02
4
546 Views
Last Modified: 2013-11-28
Can anyone help me with a very simple javascript code ... to show a random banner ad?

I have 5 images - such as the link below - each with their own very specific URL link.
I need to show one image at a time RANDOMLY.

SO if I had five images - 1,2,3,4,5 .. find a random number between 1&5 and show the appropriate image (AND it's URL) for that number.

The type of image & URL:
<a href="http://www.amazon.com/exec/obidos/ASIN/0060731583/fred"><img src="http://www.fred.com/tfranks0731.jpg"></a>


Thanks!
Richard
0
Comment
Question by:rcbuchanan
  • 2
4 Comments
 
LVL 36

Accepted Solution

by:
Zyloch earned 200 total points
ID: 11695436
Sure.
Have two arrays. One array has the src of all the images and the other has the links for each banner repectively, meaning the first element of the image src array corresponds to the first element of the links array.

i.e.
var imgSrc=new Array;
var hreflinks = new Array;

imgSrc[0]="blue.gif";
hreflinks[0]="link_for_blue.html";
imgSrc[1] = "red.gif";
hreflinks[1] = link_for_red.html";

etc.etc.

Then, have this code where you want the banner and link to appear inside the <body> tag:
<script language="javascript">
var randomNum = Math.floor(Math.random() * imgSrc.length);
document.write("<a href=\""+hreflinks[randomNum]+"\"><img src=\""+imgSrc[randomNum]+"\"></a>");
</script>

Regards,
${Zyloch}
0
 
LVL 7

Assisted Solution

by:Xxavier
Xxavier earned 200 total points
ID: 11695810
<script>
var banSrc=new Array('http://www.experts-exchange.com/images/indexLogoPerson_05.gif',
 'http://www.experts-exchange.com/images/indexLogoPerson_03.gif',
 'http://www.experts-exchange.com/images/indexLogoPerson_02.gif',
 'http://www.experts-exchange.com/images/indexLogoPerson_04.gif',
 'http://www.experts-exchange.com/images/indexLogoPerson_01.gif')

var banHref = new Array('http://google.com',
 'http://yahoo.com',
 'http://msn.com',
 'http://abc.com',
 'http://nbc.com')
</script>

<body>
<a id="banLink" href="#"><img name="banImg"></a>
<script>
 index=Math.floor(banSrc.length*Math.random())
 document.getElementById('banImg').src=banSrc[index]
 document.getElementById('banLink').href=banHref[index]
</script>
</body>


Ta! Da! Xx
0
 
LVL 33

Assisted Solution

by:humeniuk
humeniuk earned 100 total points
ID: 11695915
Those look like solid solutions to me.

For the hell of it, though, you can find 8 random images JavaScript scripts at http://www.hotscripts.com/JavaScript/Scripts_and_Programs/Randomizing/Random_Images/index.html and 25 random images PHP scripts at www.hotscripts.com/PHP/Scripts_and_Programs/Randomizing/Random_Images/index.html.
0
 
LVL 36

Expert Comment

by:Zyloch
ID: 11696068
Are you having a problem with my script?
0

Featured Post

On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Preparing an email is something we should all take special care with – especially when the email is for somebody you may not know very well. The pressures of everyday working life stacked with a hectic office environment can make this a real challen…
Starting your own business is always a daunting process, and for most people it is brand new experience. Avoid the common pitfalls by following these tips to start on the road to success.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Use Wufoo, an online form creation tool, to make powerful forms. Learn how to choose which pages of your form are visible to your users based on their inputs. The page rules feature provides you with an opportunity to create if:then statements for y…

679 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question