Search - Articles
DevASP.NET for ASP.NET, VB.NET, XML and C# (C-Sharp) Developers Tuesday, March 03, 2009
Dev Articles
Search Directory
ASP.NET
VB.Net
C-Sharp
SQL Server
 

Creating a Banner Rotator using Java Script.

Author: DevASP
Download Source Code : 590_BannerRotator.zip

This article is about how you can rotate your web pages banner ads. You will just need to set the images, URLs and the delay time. The ad images will be change after some time of period mention by you

Steps you will do.

 

 

Start visual studio and create a new web application.

 

 

Open the HTML design of your web page and add the following JavaScript functions before closing the head tag.

 

<script language="JavaScript" type="text/JavaScript">

 

var urlArray = new Array(3);

var banArray = new Array(3);

var counter = 1;

var url = "http://www.devasp.com";

 

 

urlArray[0] = "http://www.devasp.net";

urlArray[1] = "http://www.msn.com";

urlArray[2] = http://www.yahoo.com;

 

if(document.images)

{

  for(i = 0; i < 3; i++)

  {

    banArray[i] = new Image(468, 60);

    banArray[i].src = "banners/baner" + (i+1) + ".jpg";

  }

}

 

 

function changeBanner()

{

  if(counter > 2)

   counter = 0;

 

  document.banner.src = banArray[counter].src;

 

  url = urlArray[counter];

  counter++;

}

 

var timer = window.setInterval("changeBanner()", 3000);

 

</script>

 

  

Now add the following HTML code which will design the layout of your web form and call the above JavaScript functions to rotate the banner.

 

<body>

<center>

<a href="#" onClick="window.open(url,'BannerWin');">

<img src="banners/baner3.jpg" width=468 height=60 border=0 name="banner"></a>

</center>

<p><center>

<font face="arial, helvetica">Dont forget to visit Devasp.com<br>

by <a href="http://www.devasp.com">www.devasp.com</a></font>

</center>

</body>

 

Add a folder to your application root directory and name it as “banners” add the ad images in it with the name baner1, baner2, baner3 and baner4.

 

Run your application.

 

 

 

 

 

 

 

Article Comments
Thats a great stuff ther i have been looking for one for over 4 hours online when i stumbled on this, thanks.
NOW I WOULD WANT TO INTEGRATE PHP INTO IT SO AS TO LOAD THE IMAGE PATH AND URL FROM A DATABASE, AM TRYING TO BUT IF YOU COULD HELP I WOULD BE GREATFULL THANKS A LOT

Posted on 6/2/2007 1:05:28 PM by Derick Addo

   
Add Article Comment:
Name :
Email Address :
   
Comments :
 
   
<< Creating an advance Meta tag generator using Java Script.

Disclaimer - Privacy
© 2002-2017 DevASP.net