una pregunta estupida
6 seguidores
pero que no se, claro...
Quiero que cuando pase el puntero sobre un link, la tipo cambie(eso ok) y el fondo del td cambie de color....(eso no lo se)...como lo hago.
O pregunto de otra manera cual es el codigo? :D
Muxas gracias!
cbp
¿has probao con "<td onmouseover="this.backgroundColor='#colorquequieras'">?
molusco
cbp
¿has probao con "<td onmouseover="this.backgroundColor='#colorquequieras'">?
pos voy a probar....ahora te cuento ;-)
Gracias!!!
molusco
Esto no va..........me cagoentooooooooooo.....
gracias cbp, pero no funciona :-(
cbp
¿tienes una clase o un indetificador asociada a la celda?
prueba así:
<td onmouseover="this.style.backgroundColor='#a0a0a0'">
cagu'en la, con la chorrada que es esto... :?
molusco
es una hoja de estilo.... con un estado link y otro hover. Pero solo me afecta a la tipo y quiero que me afecte tb al color del td...no se si me explico....
komoko
copias estas 3 funciones antes del <body>
/////////////////////////////////////////////////////
<em>
function mOvr(src) {
if (!src.contains(event.fromElement)) {
src.style.cursor = 'hand';
src.bgColor ='#DDDDDD';
}
}
function mOut(src) {
if (!src.contains(event.toElement)) {
src.style.cursor = 'hand';
src.bgColor = '#F2F2F2';
}
}
function mClk(src) {
if(event.srcElement.tagName=='TD')
src.children.tags('A')[0].click();
}
</em>
/////////////////////////////////////////////////////
y pones esto en los td:
<em><td onClick='mClk(this)' onMouseOver='mOvr(this);' onMouseOut='mOut(this);'></em>
los colores los defines en las funciones
además, al pinchar, el td te pilla el enlace :)
salu2
cbp
sí sí, claro que te explicas, lo que pasa que un td no puede llevar elemento hover, porque en IE eso sólo funciona con los elementos "a", así que lo tienes que hacer con el onmouseover del td, por eso te preguntaba si tenías alguna clase o algún identificador asociados al td.
otra cosa que puedes hacer es simular el td manejando los margin. padding, background-color, border, etc del enlace, así puedes usar tranquilamente el hover.
molusco
voy a probar.....muchas gracias chicos!!!
gandalias
La propiedad en javascript es bgColor no backgroundColor... mira a ver con this.bgColor='#FFFFFF' y otra cosa... en el onMouseOut deberias reestablecer el color...
un saludo
gandalias
uy... ya habian respondido... :)
komoko
no olvides poner las funciones de antes entre <em><script></script>, </em>si no, no funcionará!!
salu2
cbp
gandalias
La propiedad en javascript es bgColor no backgroundColor... mira a ver con this.bgColor='#FFFFFF' y otra cosa... en el onMouseOut deberias reestablecer el color...
jooooooooooder, qué bodoque soy, es cierto, prueba todo lo anterior con bgColor en lugar de backgroundColor
qué bochorno, lo siento :oops:
molusco
vale. Ya esta hecho y funciona. Graaaaaaaaaaacias.
Peeeero, cuando paso el puntero sobre el td, cambia al color que quiero, esto ok, pero si clicas sobre el td, al no tener un link, da error en la pagina, pero yo no quiero que el td tenga link, y tampoco quiero que se vea ese error.
Si doy al link, va bien, a donde tiene que ir, pero yo solo quiero que el td cambie de color, con lo que si por lo que sea, alguien "pincha" sobre el td, no quiero que pase nada, solo que cambie de color....no que me de un error en la peich....
me explico??? :-(
cbp
¿cómo lo has hecho al final? ¿puedes poner el código?
komoko
si lo hiciste con las funciones, basta con que borres 'la que activa el click', que es esta:
<em>function mClk(src) {
if(event.srcElement.tagName=='TD')
src.children.tags('A')[0].click();
} </em>
---------------------------------------------------
y el td quedaría así, despues de haber quitado también la llamada a la función:
<em><td onMouseOver='mOvr(this);' onMouseOut='mOut(this);'></em>
hartum
moluscooooooooooo todabia estoy esperando ver esas "afotos" esta niñaaaaaaaaaaaa, si es que es de lo peor, en fin aqui te pongo un ejemplo muuuuuuuuuuuuuuuuuuuuu completo, quita o añade atu gusto:
<TR style="cursor: hand" bgcolor="#F0F0F0" OnMouseOver="bgColor='#FFCC5b'" OnMouseOut="bgColor='#f0f0f0'"
onMouseDown="parent.detalles_cliente.location.href='ficha.php?id=22'; parent.tareas.location.href='tareas_cliente.php?id=22'">
molusco
cbp
¿cómo lo has hecho al final? ¿puedes poner el código?
por supuesto....aqui esta:<code><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>OMEGA GESTI&Oacute;N INTEGRAL</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script>
function mOvr(src) {
if (!src.contains(event.fromElement)) {
src.bgColor ='#0f067d';
}
}
function mOut(src) {
if (!src.contains(event.toElement)) {
src.bgColor = '#b72727';
}
}
function mClk(src) {
if(event.srcElement.tagName=='TD')
src.children.tags('A')[0].click();
}
</script>
<style type="text/css">
<!--
BODY {
SCROLLBAR-ARROW-COLOR: #ffffff;
SCROLLBAR-FACE-COLOR: #b72727;
SCROLLBAR-HIGHLIGHT-COLOR: #d71c1c;
SCROLLBAR-SHADOW-COLOR: #870000;
SCROLLBAR-3DLIGHT-COLOR: #4444nb4;
SCROLLBAR-TRACK-COLOR: #dddddd;
SCROLLBAR-DARKSHADOW-COLOR: #870000;
cursor: auto;
}
.menu {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #FFFFFF;
text-decoration: none;
clip: rect(auto auto auto auto);
}
.menu:link {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
text-decoration: none;
}
.menu:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
text-decoration: underline;
}
-->
</style>
</head>
<body background="imagenes/bg.gif" topmargin="0">
<table width="700" height="600" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td background="imagenes/sombra_izq.gif" ></td>
<td valign="top" bgcolor="#FFFFFF"><table border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td><img src="imagenes/cabecera_index.jpg" width="700" height="181"></td>
</tr>
<tr>
<td bgcolor="#CC0000">&nbsp;</td>
</tr>
<tr>
<td><table border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top"><table width="198" border="0" cellpadding="1" cellspacing="1">
<tr>
<td><img src="imagenes/menu_titu.gif" width="198" height="31"></td>
</tr>
<tr>
<td bgcolor="#b72727" td onClick='mClk(this)' onMouseOver='mOvr(this);' onMouseOut='mOut(this);'>&nbsp;&nbsp;<strong><a href="quienes.asp" class="menu">Omega</a></strong></td>
</tr>
<tr>
<td bgcolor="#b72727">&nbsp;&nbsp;<a href="#" class="menu"><strong>Tipos
de Hipoteca</strong></a></td>
</tr>
<tr>
<td bgcolor="#d71c1c"><table width="90%" border="0" align="right" cellpadding="1" cellspacing="0">
<tr>
<td><a href="#" class="menu">Hipoteca a tu medida</a></td>
</tr>
</table></td>
</tr>
<tr>
<td bgcolor="#d71c1c"><table width="90%" border="0" align="right" cellpadding="1" cellspacing="0">
<tr>
<td><a href="#" class="menu">La casa que te puedes permitir</a></td>
</tr>
</table></td>
</tr>
<tr>
<td bgcolor="#d71c1c"><table width="90%" border="0" align="right" cellpadding="1" cellspacing="0">
<tr>
<td><a href="#" class="menu">Simulador fiscal</a></td>
</tr>
</table></td>
</tr>
<tr>
<td bgcolor="#d71c1c"><table width="90%" border="0" align="right" cellpadding="1" cellspacing="0">
<tr>
<td> <a href="#" class="menu">Gastos de compraventa e hipoteca</a></td>
</tr>
</table></td>
</tr>
<tr>
<td bgcolor="#b72727">&nbsp;&nbsp;<a href="#" class="menu"><strong>Documentaci&oacute;n
necesaria</strong></a></td>
</tr>
<tr>
<td bgcolor="#b72727">&nbsp;&nbsp;<a href="#" class="menu"><strong>Localizaci&oacute;n/contacte</strong></a></td>
</tr>
</table></td>
<td valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="5">
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="imagenes/foto_noticias1.jpg" width="88" height="61" hspace="5" vspace="5"></td>
<td valign="top">Gastos de hipoteca<br>
Falta texto noticias, falta testo noticias, falta
texto noticias</td>
</tr>
</table></td>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="imagenes/foto_noticias2.jpg" width="88" height="61" hspace="5" vspace="5"></td>
<td>&nbsp;</td>
</tr>
</table></td>
</tr>
<tr>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="imagenes/foto_noticias3.jpg" width="88" height="61" hspace="5" vspace="5"></td>
<td>&nbsp;</td>
</tr>
</table></td>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><img src="imagenes/foto_noticias4.jpg" width="88" height="61" hspace="5" vspace="5"></td>
<td>&nbsp;</td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
<tr>
<td valign="top"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="198" height="56">
<param name="movie" value="imagenes/BANNER1.swf">
<param name="quality" value="high">
<embed src="imagenes/BANNER1.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="198" height="56"></embed></object></td>
<td rowspan="2" align="center"><img src="imagenes/texto_index.gif" width="472" height="94"></td>
</tr>
<tr>
<td valign="top"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="198" height="56">
<param name="movie" value="imagenes/BANNER2.swf">
<param name="quality" value="high">
<embed src="imagenes/BANNER2.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="198" height="56"></embed></object></td>
</tr>
</table></td>
</tr>
</table></td>
<td background="imagenes/sombra_der.gif"></td>
</tr>
<tr>
<td width="3" background="imagenes/sombra_izq.gif" ><img src="imagenes/transparente.gif" width="3" height="3"></td>
<td align="center" valign="top" bgcolor="#FFFFFF"><font color="#003399" size="2" face="Verdana, Arial, Helvetica, sans-serif">Avenida
Ram&oacute;n y Cajal 17-21 (local) - 28016 Madrid - Tel: 91 416 56 13 Fax:
91 510 09 22</font></td>
<td width="3" background="imagenes/sombra_der.gif"><img src="imagenes/transparente.gif" width="3" height="3"></td>
</tr>
</table>
</body>
</html>
</code>
Tengo que quitar cosas que estorban, pero weno...........
molusco
HARTUM
moluscooooooooooo todabia estoy esperando ver esas "afotos" esta niñaaaaaaaaaaaa, si es que es de lo peor"
que fotoooosss??????????
hartum
Unas de Jerez creo.
cbp
pos eso, que si lo has hecho con esas funciones haz caso a lo que dice komoko más arriba
molusco
HARTUM
Unas de Jerez creo.
ahhhhh! si.....ya macuerdo. Esque las tengo en el movil y me tienen que dejar el chisme pa pasarlas al ordenador....pero toy en ello jijiji....
molusco
cbp
pos eso, que si lo has hecho con esas funciones haz caso a lo que dice komoko más arriba
Ok...si lo he hecho con funciones y ya esta solucionao....
muchas gracias!!!!!!!!!!!!!!!!!!!!
Que majos sois coñe! :D
boris
Jur! a ver si me podéis ayudar a dar otra vuelta de tuerca a este efecto.
El caso es que estoy currando en el mismo efecto (he pillado tarde el post) y todo correcto... peeeeeeero, estoy procurando completarlo con una opción que creo que es imposible.
En mi caso, el <tr> consta de varias columnas que acogen datos... todos con el mismo enlace.
Lo que pretendo es que cuando el usuario haga mouseover sobre los datos de cualquiera de las columnas, el resto de datos de las restantes columnas también cambie de color (estado:hover)...
Dioxxx... que mal me explico... os lo pongo en modo gráfico, así será más facil entenderlo:
http://www.creatta.net/polution/maldito_tr.gif
Si alguien me comenta la jugada... le estaré troppo agradecido, y si tal y como pienso yo, es imposible, pues también me vendría perfecto que alguien me lo dijera tajantemente... ¡para dejar de volverme loco!.
chas grasias!
hartum
si que es posible espera que me lo curre un poco y me acuerde de como leches era.
cbp
haz lo mismo pero pon la llamada al javascript en el tr en lugar de en el td
cbp
haz lo mismo pero pon la llamada al javascript en el tr en lugar de en el td
¿esto ya lo he dicho antes? :?
komoko
sacto !!
:)
boris
No si.... si eso ya lo hago, y se me ilumina todo el tr, el problema es que quiero que todos los textos de los tds del tr hagan a la vez el efecto :hover... vamos que cambien de color.
Hartum.... ¡que igual hay premio!
hartum
mo encuentro a puñetera etiqueta
cbp
se me ocurre que le pongas una clase a la fila en la que incluyas la fuente y el color de fondo y que hagas otra para cuando la fila esté activa. luego, en el onmouseover del tr, con this.className cambias a la clase activa y en el onmouseout a la inactiva. mira a ver si el className funciona en nabegadores que no sean IE porque no lo recuerdo ahora mismo.