Comportamientos en dreamweaver3
Hola, mi pregunta es la siguiente:
He creado un menu de navegación en una tabla, estando esta dividida en 8 celdas, y me gustaría hacer un efecto de cambio de color del fondo de cada celda on mouse over, creo que seria a través del inspector de comportamientos pero no soy capaz de conseguirlo, a través de css conseguí que se cambiase de color la superficie que cubre el texto, lo cual es un efecto similar, pero yo lo que pretendo es que se cubra toda la superficie de cada celda. ¿Podrías explicarme como por favor? Gracias por adelantado
He creado un menu de navegación en una tabla, estando esta dividida en 8 celdas, y me gustaría hacer un efecto de cambio de color del fondo de cada celda on mouse over, creo que seria a través del inspector de comportamientos pero no soy capaz de conseguirlo, a través de css conseguí que se cambiase de color la superficie que cubre el texto, lo cual es un efecto similar, pero yo lo que pretendo es que se cubra toda la superficie de cada celda. ¿Podrías explicarme como por favor? Gracias por adelantado
1 Respuesta
Respuesta de jaimemattos
1
Este es el contenido de in archivo código.js
=======================================================
function mOvr(src,clrOver) {
if (!src.contains(event.fromElement)) {
src.style.cursor = 'hand';
src.bgColor = clrOver;
}
}
function mOut(src,clrIn) {
if (!src.contains(event.toElement)) {
src.style.cursor = 'default';
src.bgColor = clrIn;
}
}
function mClk(src) {
if(event.srcElement.tagName=='TD'){
src.children.tags('A')[0].click();
}
}
=======================================================
Lo cargas en el <head> asi :
<script language="JavaScript" src="scripts.js"></script>
=========================================================
Luego en cada celda donde quieres el efecto utilizas
<tr>
<td align="center" onClick="mClk(this);" onMouseOut="mOut(this,'#336699');"
onMouseOver="mOvr(this,'#990000');" valign="center"
style="border-bottom: 1px solid rgb(0,0,0); padding-left: 6; padding-top: 1; padding-bottom: 1"
bgcolor="#336699" height="17"><a style="COLOR: rgb(255,255,255); TEXT-DECORATION: none"
href="index.htm"><font face="Verdana" size="2">Inicio</font></a>
</td>
</tr>
=========================================================
Espero que te haya resuelto tu problema.
Si quieres un ejemplo de ese código visita www.aprendesolo.com el menu esta hecho así.
Webmaster
www.aprendesolo.com (manuales,software, foros de ayuda y mas...)
=======================================================
function mOvr(src,clrOver) {
if (!src.contains(event.fromElement)) {
src.style.cursor = 'hand';
src.bgColor = clrOver;
}
}
function mOut(src,clrIn) {
if (!src.contains(event.toElement)) {
src.style.cursor = 'default';
src.bgColor = clrIn;
}
}
function mClk(src) {
if(event.srcElement.tagName=='TD'){
src.children.tags('A')[0].click();
}
}
=======================================================
Lo cargas en el <head> asi :
<script language="JavaScript" src="scripts.js"></script>
=========================================================
Luego en cada celda donde quieres el efecto utilizas
<tr>
<td align="center" onClick="mClk(this);" onMouseOut="mOut(this,'#336699');"
onMouseOver="mOvr(this,'#990000');" valign="center"
style="border-bottom: 1px solid rgb(0,0,0); padding-left: 6; padding-top: 1; padding-bottom: 1"
bgcolor="#336699" height="17"><a style="COLOR: rgb(255,255,255); TEXT-DECORATION: none"
href="index.htm"><font face="Verdana" size="2">Inicio</font></a>
</td>
</tr>
=========================================================
Espero que te haya resuelto tu problema.
Si quieres un ejemplo de ese código visita www.aprendesolo.com el menu esta hecho así.
Webmaster
www.aprendesolo.com (manuales,software, foros de ayuda y mas...)
