Rotating Banner Question

**Chris Crandell** · Jul 20 '05, 02:22 PM

Re: Rotating Banner Question

Ian Hubling <ian@hubling.co m> wrote in message
news:njoc20lhds qb1i6in220inlm8 ufclhi24g@4ax.c om...[color=blue]
> I'm trying to complete a rotating banner ad within a page I have. The
> rotating add has four images that rotate in three-second increments.
> I've got the images to rotate ok - but now I want to go one step
> further and can't figure out how to do it...
>
> I want to have it so that when the person clicks on the specific ad,
> they are taken to a URL that is unique to each ad.
>
> I presume I would have to surround the img tag with an href tag, but
> how would I reference the array to get the correct URL?? HELP.
>
> Here is the code I'm using. Any help would be appreciated.
>
> I've omitted unnecessary parts of the page.
>
> -----------------------------------------------
> <head>
> <script>
> var myPix, imCt, thisAd;
> myPix=new Array("images/banner01.jpg", "images/banner02.jpg",
> "images/banner03.jpg", "images/banner04.jpg");
> imgCt=myPix.len gth;
> var thisAd=0;
> function rotate()
> {
> thisAd++
> if(thisAd==imgC t)
> {
> thisAd=0;
> }
> document.adBann er.src=myPix[thisAd];
> setTimeout("rot ate()",3*1000);
> }
> </script>
> </head>
>
>
> <body onLoad="rotate( );">
> <div align="center">
> <img src="images/banner01.jpg" name="adBanner"/></div>
> </body>[/color]

Hi,
one suggestion would be to create a URL array of corresponding destinations
and
add an onclick handler to the image which uses the array and thisAd to open
the
appropriate destination.

myURL=new Array( "url1", url2", url3", url4");

function newWindow()
{
// alert( "you clicked " + thisAd);
window.open( myURL[thisAd]); // or a redirect
}

and

<img src="hook1.jpg" name="adBanner"/ onclick="newWin dow();"></div>

**Ian Hubling** · Jul 20 '05, 02:22 PM

Re: Rotating Banner Question

On Sun, 08 Feb 2004 19:19:09 GMT, "Chris Crandell"
<ccrandel@ix.ne tcom.com> wrote:
[color=blue]
>
>Ian Hubling <ian@hubling.co m> wrote in message
>news:njoc20lhd sqb1i6in220inlm 8ufclhi24g@4ax. com...[color=green]
>> I'm trying to complete a rotating banner ad within a page I have. The
>> rotating add has four images that rotate in three-second increments.
>> I've got the images to rotate ok - but now I want to go one step
>> further and can't figure out how to do it...
>>
>> I want to have it so that when the person clicks on the specific ad,
>> they are taken to a URL that is unique to each ad.
>>
>> I presume I would have to surround the img tag with an href tag, but
>> how would I reference the array to get the correct URL?? HELP.
>>
>> Here is the code I'm using. Any help would be appreciated.
>>
>> I've omitted unnecessary parts of the page.
>>
>> -----------------------------------------------
>> <head>
>> <script>
>> var myPix, imCt, thisAd;
>> myPix=new Array("images/banner01.jpg", "images/banner02.jpg",
>> "images/banner03.jpg", "images/banner04.jpg");
>> imgCt=myPix.len gth;
>> var thisAd=0;
>> function rotate()
>> {
>> thisAd++
>> if(thisAd==imgC t)
>> {
>> thisAd=0;
>> }
>> document.adBann er.src=myPix[thisAd];
>> setTimeout("rot ate()",3*1000);
>> }
>> </script>
>> </head>
>>
>>
>> <body onLoad="rotate( );">
>> <div align="center">
>> <img src="images/banner01.jpg" name="adBanner"/></div>
>> </body>[/color]
>
>Hi,
>one suggestion would be to create a URL array of corresponding destinations
>and
>add an onclick handler to the image which uses the array and thisAd to open
>the
>appropriate destination.
>
>myURL=new Array( "url1", url2", url3", url4");
>
>function newWindow()
>{
> // alert( "you clicked " + thisAd);
> window.open( myURL[thisAd]); // or a redirect
>}
>
>and
>
> <img src="hook1.jpg" name="adBanner"/ onclick="newWin dow();"></div>
>
>[/color]
Thank you very much! I modified it slightly from your response - but
you gave me exactly what I was looking for. Here's the script I ended
up with. Works like a charm!

//-------------------------------------------------------

<head>
<script>
var myPix, imCt, thisAd;
myPix=new Array("images/banner02.jpg", "images/banner03.jpg",
"images/banner04.jpg");
imgCt=myPix.len gth;
var thisAd=0;
function rotate()
{
thisAd++
if(thisAd==imgC t)
{
thisAd=0;
}
document.adBann er.src=myPix[thisAd];
setTimeout("rot ate()",3*1000);
}

myURL=new Array("url1.htm ", "url2.htm","url 3.htm");
function vgotoad()
{
window.location .href(myURL[thisAd]);
}
</script>
</head>

<body onLoad="rotate( );">

<div align="center"> <img src="images/banner01.jpg" name="adBanner"
onClick="vgotoa d();"></div>
</body>

**Chris Crandell** · Jul 20 '05, 02:23 PM

Re: Rotating Banner Question

Ian Hubling <ian@hubling.co m> wrote in message
news:qopd20h8mm sv7rgv0uu01cqfk sait97vk6@4ax.c om...[color=blue]
> On Sun, 08 Feb 2004 19:19:09 GMT, "Chris Crandell"
> <ccrandel@ix.ne tcom.com> wrote:
>[color=green]
> >
> >Ian Hubling <ian@hubling.co m> wrote in message
> >news:njoc20lhd sqb1i6in220inlm 8ufclhi24g@4ax. com...[color=darkred]
> >> I'm trying to complete a rotating banner ad within a page I have. The
> >> rotating add has four images that rotate in three-second increments.
> >> I've got the images to rotate ok - but now I want to go one step
> >> further and can't figure out how to do it...
> >>
> >> I want to have it so that when the person clicks on the specific ad,
> >> they are taken to a URL that is unique to each ad.
> >>
> >> I presume I would have to surround the img tag with an href tag, but
> >> how would I reference the array to get the correct URL?? HELP.
> >>
> >> Here is the code I'm using. Any help would be appreciated.
> >>
> >> I've omitted unnecessary parts of the page.
> >>
> >> -----------------------------------------------
> >> <head>
> >> <script>
> >> var myPix, imCt, thisAd;
> >> myPix=new Array("images/banner01.jpg", "images/banner02.jpg",
> >> "images/banner03.jpg", "images/banner04.jpg");
> >> imgCt=myPix.len gth;
> >> var thisAd=0;
> >> function rotate()
> >> {
> >> thisAd++
> >> if(thisAd==imgC t)
> >> {
> >> thisAd=0;
> >> }
> >> document.adBann er.src=myPix[thisAd];
> >> setTimeout("rot ate()",3*1000);
> >> }
> >> </script>
> >> </head>
> >>
> >>
> >> <body onLoad="rotate( );">
> >> <div align="center">
> >> <img src="images/banner01.jpg" name="adBanner"/></div>
> >> </body>[/color]
> >
> >Hi,
> >one suggestion would be to create a URL array of corresponding[/color][/color]
destinations[color=blue][color=green]
> >and
> >add an onclick handler to the image which uses the array and thisAd to[/color][/color]
open[color=blue][color=green]
> >the
> >appropriate destination.
> >
> >myURL=new Array( "url1", url2", url3", url4");
> >
> >function newWindow()
> >{
> > // alert( "you clicked " + thisAd);
> > window.open( myURL[thisAd]); // or a redirect
> >}
> >
> >and
> >
> > <img src="hook1.jpg" name="adBanner"/ onclick="newWin dow();"></div>
> >
> >[/color]
> Thank you very much! I modified it slightly from your response - but
> you gave me exactly what I was looking for. Here's the script I ended
> up with. Works like a charm!
>
> //-------------------------------------------------------
>
> <head>
> <script>
> var myPix, imCt, thisAd;
> myPix=new Array("images/banner02.jpg", "images/banner03.jpg",
> "images/banner04.jpg");
> imgCt=myPix.len gth;
> var thisAd=0;
> function rotate()
> {
> thisAd++
> if(thisAd==imgC t)
> {
> thisAd=0;
> }
> document.adBann er.src=myPix[thisAd];
> setTimeout("rot ate()",3*1000);
> }
>
> myURL=new Array("url1.htm ", "url2.htm","url 3.htm");
> function vgotoad()
> {
> window.location .href(myURL[thisAd]);
> }
> </script>
> </head>
>
> <body onLoad="rotate( );">
>
> <div align="center"> <img src="images/banner01.jpg" name="adBanner"
> onClick="vgotoa d();"></div>
> </body>
>[/color]

Glad I could help !

**EMC** · Jul 23 '05, 10:28 AM

Re: Rotating Banner Question

Hi -
Yes I agree very helpful. Two quick follow-up, questions. How woul
you add the cursor switch, that is when I mouse over (the rotatin
images), the cursor does not switch to a hand (for example). I trie
adding style cursor auto line in the body tag , to no avail. Secon
question, this works fine in newer versions of Mozilla and Netscap
(6.x ->) but nothing happens in say Netscape 4.7x. No JS error
nothing. Any ideas here.
Thanks a bunch -
EMC

Chris Crandell wrote:[color=blue]
> *Ian Hubling <ian@hubling.co m> wrote in message
> news:qopd20h8mm sv7rgv0uu01cqfk sait97vk6@4ax.c om...[color=green]
> > On Sun, 08 Feb 2004 19:19:09 GMT, "Chris Crandell"
> > <ccrandel@ix.ne tcom.com> wrote:
> >[/color]
> destinations[color=blue]
> open[color=blue][color=green]
> > Thank you very much! I modified it slightly from your response[/color]
> but[color=green]
> > you gave me exactly what I was looking for. Here's the script[/color]
> ended[color=green]
> > up with. Works like a charm!
> >
> > //-------------------------------------------------------
> >
> > <head>
> > <script>
> > var myPix, imCt, thisAd;
> > myPix=new Array("images/banner02.jpg", "images/banner03.jpg",
> > "images/banner04.jpg");
> > imgCt=myPix.len gth;
> > var thisAd=0;
> > function rotate()
> > {
> > thisAd++
> > if(thisAd==imgC t)
> > {
> > thisAd=0;
> > }
> > document.adBann er.src=myPix[thisAd];
> > setTimeout("rot ate()",3*1000);
> > }
> >
> > myURL=new Array("url1.htm ", "url2.htm","url 3.htm");
> > function vgotoad()
> > {
> > window.location .href(myURL[thisAd]);
> > }
> > </script>
> > </head>
> >
> > <body onLoad="rotate( );">
> >
> > <div align="center"> <img src="images/banner01.jpg" name="adBanner"
> > onClick="vgotoa d();"></div>
> > </body>
> >[/color]
>
> Glad I could help ![/color]

-
EM

Rotating Banner Question

Rotating Banner Question

Comment

Comment

Comment

Comment