Ver Mensaje Individual
  #1 (permalink)  
Antiguo 16/10/2009, 00:02
AngelofHope
 
Fecha de Ingreso: abril-2007
Mensajes: 53
Antigüedad: 19 años, 6 meses
Puntos: 0
De acuerdo Menu Imagen con Onclick seleccionado

Saludo, Tengo qu ehacer un menu Igual Igual al de http://www.bestwestern.com
si lo ven es un menu de imagenes que tiene 3 estados
1. El normal azul
2. El Over que es amarillo
3. El OnClick que es el que se queda selecionado en AZUL

El menu lo hize con Adobe Fireworks Cs3 y quedo excelente pero .. no se como hacer para que el evento ONclick se quede seleciconado Cuando estoy dentro de la pagina que hize click. y asi susesivamente en cada seccion que haga click el boton se quede en azul (onClick) dependiendo de la pagina en que este. Me ayudan a hacer que se quede seleccionado en Onlcik color azul dentro de cada seccion?

El codigo javascript que genero el Fireworks Cs3 es:
Código PHP:
<script language="JavaScript">
<!--
function 
MM_findObj(n, d) { //v4.01
  
var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(
x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(
i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!
x && d.getElementById) x=d.getElementById(n); return x;
}
function 
MM_nbGroup(event, grpName) { //v6.0
var i,img,nbArr,args=MM_nbGroup.arguments;
  if (
event == "init" && args.length > 2) {
    if ((
img = MM_findObj(args[2])) != null && !img.MM_init) {
      
img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;
      if ((
nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();
      
nbArr[nbArr.length] = img;
      for (
i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
        if (!
img.MM_up) img.MM_up = img.src;
        
img.src = img.MM_dn = args[i+1];
        
nbArr[nbArr.length] = img;
    } }
  } else if (
event == "over") {
    
document.MM_nbOver = nbArr = new Array();
    for (
i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args[i])) != null) {
      if (!
img.MM_up) img.MM_up = img.src;
      
img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])?args[i+1] : img.MM_up);
      
nbArr[nbArr.length] = img;
    }
  } else if (
event == "out" ) {
    for (
i=0; i < document.MM_nbOver.length; i++) { img = document.MM_nbOver[i]; img.src = (img.MM_dn) ? img.MM_dn : img.MM_up; }
  } else if (
event == "down") {
    
nbArr = document[grpName];
    if (
nbArr) for (i=0; i < nbArr.length; i++) { img=nbArr[i]; img.src = img.MM_up; img.MM_dn = 0; }
    
document[grpName] = nbArr = new Array();
    for (
i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
      if (!
img.MM_up) img.MM_up = img.src;
      
img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;
      
nbArr[nbArr.length] = img;
  } }
}

function 
MM_preloadImages() { //v3.0
  
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var 
i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (
a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

//-->
</script> 
El codigo que despliega los menus es:

Código PHP:
<table border="0" cellpadding="0" cellspacing="0" width="830">
      <
tr>
        <
td>
        <
img src="images/spacer.gif" width="121" height="1" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="109" height="1" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="4" height="1" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="146" height="1" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="3" height="1" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="85" height="1" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="4" height="1" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="85" height="1" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="4" height="1" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="146" height="1" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="3" height="1" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="85" height="1" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="35" height="1" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="1" height="1" border="0" alt=""></td>
    </
tr>
    <
tr>
        <
td rowspan="5">
        <
img name="menu_r1_c1" src="images/menu_r1_c1.gif" width="121" height="36" border="0" alt=""></td>
        <
td rowspan="4">
        <
a onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','menu_r1_c2','images/menu_r1_c2_f2.gif','images/menu_r1_c2_f4.gif',1);" onClick="MM_nbGroup('down','navbar1','menu_r1_c2','images/menu_r1_c2_f3.gif',1);" href="javascript:;">
        <
img name="menu_r1_c2" src="images/menu_r1_c2.gif" width="109" height="29" border="0" alt=""></a></td>
        <
td rowspan="5">
        <
img name="menu_r1_c3" src="images/menu_r1_c3.gif" width="4" height="36" border="0" alt=""></td>
        <
td>
        <
a onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','menu_r1_c4','images/menu_r1_c4_f2.gif','images/menu_r1_c4_f4.gif',1);" onClick="MM_nbGroup('down','navbar1','menu_r1_c4','images/menu_r1_c4_f3.gif',1);" href="javascript:;">
        <
img name="menu_r1_c4" src="images/menu_r1_c4.gif" width="146" height="26" border="0" alt=""></a></td>
        <
td rowspan="5">
        <
img name="menu_r1_c5" src="images/menu_r1_c5.gif" width="3" height="36" border="0" alt=""></td>
        <
td rowspan="2">
        <
a onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','menu_r1_c6','images/menu_r1_c6_f2.gif','images/menu_r1_c6_f4.gif',1);" onClick="MM_nbGroup('down','navbar1','menu_r1_c6','images/menu_r1_c6_f3.gif',1);" href="javascript:;">
        <
img name="menu_r1_c6" src="images/menu_r1_c6.gif" width="85" height="27" border="0" alt=""></a></td>
        <
td rowspan="5">
        <
img name="menu_r1_c7" src="images/menu_r1_c7.gif" width="4" height="36" border="0" alt=""></td>
        <
td>
        <
a onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','menu_r1_c8','images/menu_r1_c8_f2.gif','images/menu_r1_c8_f4.gif',1);" onClick="MM_nbGroup('down','navbar1','menu_r1_c8','images/menu_r1_c8_f3.gif',1);" href="javascript:;">
        <
img name="menu_r1_c8" src="images/menu_r1_c8.gif" width="85" height="26" border="0" alt=""></a></td>
        <
td rowspan="5">
        <
img name="menu_r1_c9" src="images/menu_r1_c9.gif" width="4" height="36" border="0" alt=""></td>
        <
td rowspan="3">
        <
a onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','menu_r1_c10','images/menu_r1_c10_f2.gif','images/menu_r1_c10_f4.gif',1);" onClick="MM_nbGroup('down','navbar1','menu_r1_c10','images/menu_r1_c10_f3.gif',1);" href="javascript:;">
        <
img name="menu_r1_c10" src="images/menu_r1_c10.gif" width="146" height="28" border="0" alt=""></a></td>
        <
td rowspan="5">
        <
img name="menu_r1_c11" src="images/menu_r1_c11.gif" width="3" height="36" border="0" alt=""></td>
        <
td>
        <
a onMouseOut="MM_nbGroup('out');" onMouseOver="MM_nbGroup('over','menu_r1_c12','images/menu_r1_c12_f2.gif','images/menu_r1_c12_f4.gif',1);" onClick="MM_nbGroup('down','navbar1','menu_r1_c12','images/menu_r1_c12_f3.gif',1);" href="javascript:;">
        <
img name="menu_r1_c12" src="images/menu_r1_c12.gif" width="85" height="26" border="0" alt=""></a></td>
        <
td rowspan="5">
        <
img name="menu_r1_c13" src="images/menu_r1_c13.gif" width="35" height="36" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="1" height="26" border="0" alt=""></td>
    </
tr>
    <
tr>
        <
td rowspan="4">
        <
img name="menu_r2_c4" src="images/menu_r2_c4.gif" width="146" height="10" border="0" alt=""></td>
        <
td rowspan="4">
        <
img name="menu_r2_c8" src="images/menu_r2_c8.gif" width="85" height="10" border="0" alt=""></td>
        <
td rowspan="4">
        <
img name="menu_r2_c12" src="images/menu_r2_c12.gif" width="85" height="10" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="1" height="1" border="0" alt=""></td>
    </
tr>
    <
tr>
        <
td rowspan="3">
        <
img name="menu_r3_c6" src="images/menu_r3_c6.gif" width="85" height="9" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="1" height="1" border="0" alt=""></td>
    </
tr>
    <
tr>
        <
td rowspan="2">
        <
img name="menu_r4_c10" src="images/menu_r4_c10.gif" width="146" height="8" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="1" height="1" border="0" alt=""></td>
    </
tr>
    <
tr>
        <
td>
        <
img name="menu_r5_c2" src="images/menu_r5_c2.gif" width="109" height="7" border="0" alt=""></td>
        <
td>
        <
img src="images/spacer.gif" width="1" height="7" border="0" alt=""></td>
    </
tr>
</
table> 
me ayudan PORFAVOR!!!!!! gracias