Create Dynamic Banners By Using JavaScript

This is an example of how to dynamically display banners using JavaScript.

There are two parts to this method:

Write a meta tag as below:
```
<meta http-equiv="refresh" content="10">
```
This means that the page will refresh every 10 seconds. You may change the value "10" to any number.

2. Using getSeconds() method:

In JavaScript, the seconds are set as 0 - 59. You can divide this up as as you want. In this sample we divide the seconds into 6 sections:

We apply document.write to write a banner:

     if ((ss>=30)&&(ss<=39))
     document.write("<img src='BanC1line.gif' border='0'>")

In total we write 6 banners each different time slot within a single minute, and link the banners to different URL so the banners automatically change every 10 seconds. When the client clicks a banner they will be taken to the advertisers web site.

Below is the source code:

     <html><head>
     <title>Dynamic Banners</title>
     <meta name="Author" content="Nongjian Zhou">
     <meta http-equiv="refresh" content="10">
     <style type="text/css">
     <!--
     a:active { color: #0000FF; text-decoration: none}
     a:hover { color: #CC0000; text-decoration: none}
     a:visited { text-decoration: none}
     a:link { text-decoration: none}
     -->
     </style>
     </head>
     <body bgcolor=#ffffff>
     <script language="JavaScript">
     var banTime= new Date()
     var ss=banTime.getSeconds()
     
     if ((ss>=0)&&(ss<=9))
        document.write(
         "<table width=550 height=70 bgcolor=#336699 cellspacing=2><tr><td 
     align=center bgcolor=#ffeeee><font color=#666680 size=7><i><a href='#'
         onClick=window.open('http://www.webcollege.bizland.com/jsPub/index.htm',
         '','width=500 height=400')>JavaScript For Beginners</a></i></font>
         </td></tr></table>")

     if ((ss>=10)&&(ss<=19))
         document.write(
         "<a href='#' onClick=window.open('http://internetcollege.virtualave.net',
         '','width=500 height=400')><img 
         src='http://www.webcollege.bizland.com/BanInternetc.gif' border='0'></a>")

     if ((ss>=20)&&(ss<=29))
         document.write(
         "<a href='#' onClick=window.open('http://www.ishopnomarkup.com',
         '','width=500 height=400')><img 
         src='http://www.webcollege.bizland.com/BanIshop.gif' border='0'></a>")

     if ((ss>=30)&&(ss<=39))
         document.write(
         "<img src='http://www.webcollege.bizland.com/BanC1line.gif' border='0'>")

     if ((ss>=40)&&(ss<=49))
        document.write(
         "<table width=550 height=70 bgcolor=#336699 cellspacing=2><tr><td 
         align=center bgcolor=#ffeeff><font color=#6666ff size=7><i><a 
         href='#' onClick=window.open('http://www.tongchiu.com','',
         'width=500 height=400')>Tong&chiu Web Design Inc.</a></i></font>
         </td></tr></table>")

     if ((ss>=50)&&(ss<=59))
         document.write(
         "<table width=550 height=70 bgcolor=#336699 cellspacing=2><tr><td 
         align=center bgcolor=#eeeeff><font color=#008000 size=7><i><a 
         href='#' onClick=window.open('http://members.xoom.com/chinainfoma',
         '','width=500 height=400')>A Guide To China</a></i></font>
         </td></tr></table>")
     </script>
     </body></html>

You can change the method. For example, use GetHours() to set different image or text files display in different hours. To learn more about JavaScript, you can go to JavaScript For Beginners.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here

About the Author

Nongjian Zhou

www.itechcollege.com

East Timor

Member

Senior Web Specialist.

Read my other articles for beginners on iTechCollege.com:

PHP For Beginners
JSP For Beginners
ASP For Beginners
ASP.NET For Beginners
SQL For Beginners
AJAX For Beginners
HTML For Beginners
Javascript For Beginners
CSS For Beginners
FTP For Beginners
XML For Beginners
C++ For Beginners

Article Top

Poor

Excellent

Add a reason or comment to your vote: x
Votes of 3 or less require a comment

Comments and Discussions

You must Sign In to use this message board. (secure sign-in)

Search this forum
	Profile popups Noise Layout Per page

3:44 8 May '07

17:27 5 Mar '02

Create Dynamic Banners By Using JavaScript

malar

19:41 8 Feb '01

i saw one example in Create Dynamic Banners By Using JavaScript in your site. is it possible to get the image,url and tooltip from table using asp (sql server). if it is possible explain me in detail.
Sign In·View Thread·Permalink