asked on

Javascript banner rotation

I use the javascript below to rotate some banners. I works fine, I just want to provide nav btns/links to stop the rotation, click to a specific banner and restart the rotation.

Thanks,
WD

<script type=text/javascript>
var _banners = new Array();
function addBanner(_bannerHTML){
  _banners[_banners.length?_banners.length:0]=_bannerHTML;
}
addBanner("<a href='contact_us.asp?Subject=Catalogue Request'><img border=0 alt='Request a Catalogue' src='images/banners/1.jpg'></a>");
addBanner("<a href='gallery_blurb.asp?catid=138'><img border=0 alt='Tanzanite Collection' src='images/banners/2.jpg'></a>");
addBanner("<a href='staffers.asp?catid=138'><img border=0 alt='Meet the Staff' src='images/banners/3.jpg'></a>");
 
var div2 = new NewDiv2(window, "banner", _banners[0],0,0,50,50,500,"ABSOLUTE");
var count=0; /* which one to start with */
function doIt() {
count++;
count%=_banners.length;
div2.setBody(_banners[count]);
}
setInterval('doIt()',10000);
</script>

Open in new window

sh0e

<script type=text/javascript>
var _banners = new Array();
function addBanner(_bannerHTML){
  _banners[_banners.length?_banners.length:0]=_bannerHTML;
}
addBanner("<a href='contact_us.asp?Subject=Catalogue Request'><img border=0 alt='Request a Catalogue' src='images/banners/1.jpg'></a>");
addBanner("<a href='gallery_blurb.asp?catid=138'><img border=0 alt='Tanzanite Collection' src='images/banners/2.jpg'></a>");
addBanner("<a href='staffers.asp?catid=138'><img border=0 alt='Meet the Staff' src='images/banners/3.jpg'></a>");
 
var div2 = new NewDiv2(window, "banner", _banners[0],0,0,50,50,500,"ABSOLUTE");
var count=0; /* which one to start with */
function doIt() {
count++;
count%=_banners.length;
div2.setBody(_banners[count]);
}
var si = setInterval('doIt()',10000);
 
function restartBanner(start){
clearInterval(si);
count=start;
si = setInterval('doIt()',10000);
}
</script>
<input type="button" onClick="restartBanner(1)" value="Restart at position 1"></input>

Open in new window

webdork

ASKER

Nothing happens

sh0e

Need more details. Does the button not do anything? Did you copy and paste the code?
I implemented the code as a working page and found no problems.

<script type=text/javascript>
var _banners = new Array();
var divid; var si;
var count=0;
 
function addBanner(_bannerHTML){
  _banners[_banners.length?_banners.length:0]=_bannerHTML;
}
addBanner("<a href='contact_us.asp?Subject=Catalogue Request'><img border=0 alt='Request a Catalogue' src='images/banners/1.jpg'></a>");
addBanner("<a href='gallery_blurb.asp?catid=138'><img border=0 alt='Tanzanite Collection' src='images/banners/2.jpg'></a>");
addBanner("<a href='staffers.asp?catid=138'><img border=0 alt='Meet the Staff' src='images/banners/3.jpg'></a>");
 
function doIt() {
count%=_banners.length;
divid.innerHTML=_banners[count];
count++;
}
 
function loads(){
divid = document.getElementById('div2');
doIt();
si = setInterval('doIt()',1000);
}
 
function restartBanner(start){
clearInterval(si);
count=start;
doIt();
si = setInterval('doIt()',1000);
}
</script>
 
<body onload="loads()">
<input type="text" value="1" id="input1"></input>
<input type="button" onClick="restartBanner(document.getElementById('input1').value)" value="Restart at position (starts at 0 index)"></input>
<div id='div2'></div>
</body>

Open in new window

webdork

ASKER

Yeah Ok now it works. And I can see how to make links to each individual banner. Can you add a start and stop?

Thanks,

WD

ASKER CERTIFIED SOLUTION

sh0e

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

webdork

ASKER

You're the man.

Thanks