[jonnekke]

Hi there..

I got these lines of html:

HTML Code:

<tr>
       <td id="item1" style="background-color:#141414;" class="active" onclick="ClickNr('item1',0);" onmouseover="OverNr('item1')" onmouseout="TerugNr('item1')" >1</td>
       <td id="item2" style="background-color:#000000; border-left:1px solid #666666;" class="inactive" onclick="ClickNr('item2',1);" onmouseover="OverNr('item2')" onmouseout="TerugNr('item2')" >2</td>
       <td id="item3" style="background-color:#000000; border-left:1px solid #666666;" class="inactive" onclick="ClickNr('item3',2);" onmouseover="OverNr('item3')" onmouseout="TerugNr('item3')" >3</td>
       <td id="item4" style="background-color:#000000; border-left:1px solid #666666;" class="inactive" onclick="ClickNr('item4',3);" onmouseover="OverNr('item4')" onmouseout="TerugNr('item4')" >4</td>
</tr>
<tr>
       <td id="berichten" class="berichten" colspan="4"><img id="banner_img" src="images/banner/banner1.jpg" width="300px" height="74px" border="0" style="cursor:pointer;" /></td>
</tr>

in this javascript the banners change each 5 seconds and after click in one of the <td> above the banner...

Code:

var banners = new Array("images/banner/banner1.jpg","images/banner/banner2.jpg","images/banner/banner3.jpg","images/banner/banner4.jpg");
var linked = new Array("http://www.nu.nl","http://www.startpagina.nl","http://www.msn.com","http://www.google.nl");

var loop_pause = 4000;
var click_pause = 0000;
var looop;
var NrItem;
function ChooseNr(tagtog){
   for(var i=1;i<=4;i++){
      document.getElementById('item'+i).className = 'inactive';
      document.getElementById('item'+i).style.backgroundColor = '#000000';
   }
   document.getElementById(tagtog).className = 'active';
   document.getElementById(tagtog).style.backgroundColor = '#141414';
   if(tagtog == 'item1'){
      document.getElementById("banner_img").src = banners[0];
      looop=setTimeout('ChooseNr("item2")', loop_pause);
   }
   else if(tagtog == 'item2'){
      document.getElementById("banner_img").src = banners[1];
      looop=setTimeout('ChooseNr("item3")', loop_pause);
   }
   else if(tagtog == 'item3'){
      document.getElementById("banner_img").src = banners[2];
      looop=setTimeout('ChooseNr("item4")', loop_pause);
   }
   else if(tagtog == 'item4'){
      document.getElementById("banner_img").src = banners[3];
      looop=setTimeout('ChooseNr("item1")', loop_pause);
   }
}
function ClickNr(i,v){
   clearTimeout(looop);
   NrItem=i;
   document.getElementById("banner_img").src = banners[v];
   looop=setTimeout('ChooseNr(NrItem)', click_pause);
}

How can I add a link (in the array linked) to the different images?.. So when image 1 is displayed link 1 must be connected to that.


_j

[Yeroon]

Quick sample for one of your banners:

Code:

if(tagtog == 'item1'){
      document.getElementById("banner_img").src = banners[0];
      document.getElementById("banner_img").onclick = "window.open(linked[0], "myWindow");";
      document.getElementById("banner_img").style.cursor=pointer;
      looop=setTimeout('ChooseNr("item2")', loop_pause);
   }

[jonnekke]

thnx yeroon...

but it's not working yet...


Got is like this now:

Code:

var linked = new Array("http://www.nu.nl","http://www.startpagina.nl","http://www.msn.com","http://www.google.nl");
document.getElementById("banner_img").onClick = 'window.open(linked[0], "myWindow");';

HTML Code:

<img id="banner_img" src="images/banner/banner1.jpg" width="300px" height="74px" border="0" style="cursor:pointer;" />

the link is not attached to the banner...

_j

[Yeroon]

And like this?

Code:

var linked = new Array("http://www.nu.nl","http://www.startpagina.nl","http://www.msn.com","http://www.google.nl");
document.getElementById("banner_img").onClick = function() {openWin(linked[0]);};

Add function to javscript section:

Code:

function openWin(link){
  window.open(link, 'MyWin');
  
}