Foros del Web » Creando para Internet » Diseño web »

cambio de color de celdas

Estas en el tema de cambio de color de celdas en el foro de Diseño web en Foros del Web. Buenos dias... tengo un menu echo con css q al pasar el mouse por encima se cambia de color. Código: .menu1 { font-size: 11px; width:150px; ...
  #1 (permalink)  
Antiguo 25/01/2006, 02:21
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 11 años, 8 meses
Puntos: 10
cambio de color de celdas

Buenos dias...
tengo un menu echo con css q al pasar el mouse por encima se cambia de color.
Código:
.menu1 {
	font-size: 11px;
	width:150px;
	height:15px;
	background-color: #CCCCCC;
	color: #000000;
	font-weight: normal;
}

.menu1 a:link, .menu1 a:visited 
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	width:150px;
	height:15px;
	color: #000000;
	font-weight: normal;
	text-decoration: none;
}

.menu1 a:hover,.menu1 a:active
{
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 11px;
	background-color: #0A81CA;
	color: white;
}
La pagina esta divida en 2 frames, uno q es el menu y el otro es el main... me gustaria saber si se puede dejar un color diferente el link seleccionado y q no cambie a color normal hasta q se vuelva a clickar en el menu...
como puedo hacerlo?

Gracias de antemano,

Saludos
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #2 (permalink)  
Antiguo 26/01/2006, 08:08
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 11 años, 8 meses
Puntos: 10
buenas tardes!

Alguna idea de como hacer ese menu?

Gracias
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #3 (permalink)  
Antiguo 26/01/2006, 08:42
Avatar de Acadio  
Fecha de Ingreso: octubre-2005
Mensajes: 48
Antigüedad: 10 años, 11 meses
Puntos: 0
Con JavaScript.
Busca algun Script en el Google que cambie dinamicamente los estilos de los links.
  #4 (permalink)  
Antiguo 26/01/2006, 08:47
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 11 años, 8 meses
Puntos: 10
si eso ya lo encontrado... lo q no encuentro es lo de dejar el link de un color diferente al resto mientras estoy consultando ese apartado...
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #5 (permalink)  
Antiguo 26/01/2006, 08:56
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 14 años, 7 meses
Puntos: 770
Hola sergi_climent

Echa un vistazo a este mesaje a ver si te ayuda:

http://www.forosdelweb.com/f13/cambiar-color-fondo-div-hacer-clic-uno-u-otro-sin-resolver-365217/

Saludos,
  #6 (permalink)  
Antiguo 26/01/2006, 09:42
Avatar de Acadio  
Fecha de Ingreso: octubre-2005
Mensajes: 48
Antigüedad: 10 años, 11 meses
Puntos: 0
Hombre a ver , yo no me referia a un simple ahover..

document.getElementById(menu).setAttribute("class" ,newClass);
  #7 (permalink)  
Antiguo 26/01/2006, 09:55
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 11 años, 8 meses
Puntos: 10
me sirve pero no consigo adaptarlo...
he conseguido adaptar el codigo pero me da un error... al intentar abrir el link... me dice q se requiere un objeto en la linea 20 y la linea 20 es la 3era funcion.
De javascript no domino mucho... aver si me podeis echar una mano...

Código HTML:
<script>
		var pepe=null; //***
		function mano(cual){
		document.body.style.cursor='hand';
		cual.style.backgroundColor='#0A81CA';
		};
		
		 function flecha(cual){
			document.body.style.cursor='default';
			cual.style.backgroundColor=(cual==pepe)?'red':'#CCCCCC';
		}
		
		function abrir(pag,e){
		elemento = document.getElementById(e);
		if (pepe){pepe.style.backgroundColor='#0A81CA';}
			pepe = elemento; //***
			elemento.style.backgroundColor = 'red';			
			parent.main.location.href=pag;
		}

</script>
...
<td>
   <div id="noticia" STYLE="background:#CCCCCC"  name="noticia" OnMouseOver="mano(this)" onmouseout="flecha(this)" onClick="abrir('noticia.php','perico')">Puntos de Venta</div>
</td> 
Gracias por todo
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #8 (permalink)  
Antiguo 26/01/2006, 10:07
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 14 años, 7 meses
Puntos: 770
Hola de nuevo.

en el evento onclick el segundo parámetro tiene que ser el id del <div> que pulsar. Tú has puesto:

onclick="abrir('noticia.php','perico')

y debería ser:

onclick="abrir('noticia.php','noticia')

A ver si así te funciona. Saludos,
  #9 (permalink)  
Antiguo 26/01/2006, 10:14
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 11 años, 8 meses
Puntos: 10
jaja... no me dado cuenta... lo tenia puesto como prueba pero igualmente si pongo abrir('noticia.php','noticia') me sigue dando el mismo error..
hay alguna funcion q no tenga?
se puede hacer algo parecido en <a href="direccion" target="main" onmousever="" onmouseout=""... > ????
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #10 (permalink)  
Antiguo 26/01/2006, 11:04
Avatar de ludovico2000  
Fecha de Ingreso: noviembre-2003
Ubicación: Bizkaia
Mensajes: 1.315
Antigüedad: 12 años, 10 meses
Puntos: 2
...pues a mi me funciona perfectamente...
  #11 (permalink)  
Antiguo 27/01/2006, 00:23
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 11 años, 8 meses
Puntos: 10
ya encontre el error q tenia... el problema q tenia es q tengo el menu dinamico, es decir, q lo cargo casi todo de una consulta y me deje un parametro q no era dinamico y se repetia en cada div, luego aki me daba el error.

Gracias x todo a todos,

Saludos
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #12 (permalink)  
Antiguo 27/01/2006, 09:54
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 11 años, 8 meses
Puntos: 10
una cosita mas...
como puedo alinear el texto q hay dentro de los div. Si creo el menu con unas celdas anchas el texto siempre se me keda arriba. ya he probado alinear el td q contiene el div, tambien he probado con la propiedad style:"text-align"y nada... lo que no encuentro el valign=middle q es lo q me haria falta en el div.

Gracias de antemano,

Saludos
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #13 (permalink)  
Antiguo 30/01/2006, 08:12
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 11 años, 8 meses
Puntos: 10
alguna idea de como puedo hacer para alinear el texto???

Muchas gracias!

Saludos
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #14 (permalink)  
Antiguo 30/01/2006, 12:14
Avatar de ludovico2000  
Fecha de Ingreso: noviembre-2003
Ubicación: Bizkaia
Mensajes: 1.315
Antigüedad: 12 años, 10 meses
Puntos: 2
No metas el div en una tabla, mete una tabla en el div:

prueba esto:
Código:
<html>
<head>
</head>
<body>

<div STYLE="background:#A5A7FF;width:100px;height:60px"  name="textodiv1">
 texto div 1
</div>

<div STYLE="background:#B5B7FF;width:100px;height:60px"  name="textodiv2">
 <table width="100px" height="60px">
  <tr>
   <td>
    texto div 2
   </td>
  </tr>
 </table>
</div>

<div STYLE="background:#C5C7FF;width:100px;height:60px"  name="textodiv3">
 <table width="100px" height="60px">
  <tr>
   <td valign="middle">
    texto div 3
   </td>
  </tr>
 </table>
</div>

<div STYLE="background:#D5D7FF;width:100px;height:60px"  name="textodiv4">
 <table width="100px" height="60px">
  <tr>
   <td align="center">
    texto div 4
   </td>
  </tr>
 </table>
</div>

<div STYLE="background:#E5E7FF;width:100px;height:60px"  name="textodiv5">
 <table width="100px" height="60px">
  <tr>
   <td valign="middle" align="center">
    texto div 5
   </td>
  </tr>
 </table>
</div>

</body>
</html>
A ver si es lo que quieres

  #15 (permalink)  
Antiguo 31/01/2006, 08:07
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 11 años, 8 meses
Puntos: 10
si lo hago asi entonces la propiedades del texto q tengo echo en javascript no me iran!
Código HTML:
<html>
<head>
	<title>Roler</title>
	<link rel="stylesheet" type="text/css" href="/esp/css/estils.css">
	<script>
		var pepe=null; //***
		function mano(cual){
		document.body.style.cursor='hand';
		cual.style.backgroundColor='#0A81CA';
		cual.style.color='#FFFFFF';
		cual.style.fontSize='11px';
		}
		
		 function flecha(cual){
			document.body.style.cursor='default';
			cual.style.backgroundColor=(cual==pepe)?'#0A81CA':'#CCCCCC';
			cual.style.color=(cual==pepe)?'#FFFFFF':'#000000';
			cual.style.fontSize='11px';
		}
		
		function abrir(pag,e){
		elemento = document.getElementById(e);
		if (pepe){
			pepe.style.backgroundColor='#CCCCCC';
			pepe.style.color='#000000';
			pepe.style.fontSize='11px';
		}
			pepe = elemento; //***
			elemento.style.backgroundColor = '#0A81CA';	
			elemento.style.color='#FFFFFF';
			elemento.style.fontSize='11px';
			window.parent.frames[2].location.href=pag;
		}
</script>
</head>
<body>
<table width="100%" height="100%" cellpadding="0" cellspacing="0" class="cuadre">
<tr valign="middle">
<td valign="middle" align="center" colspan="3">
<?
$sql_familia = "SELECT DISTINCT familia.codi_familia,nom_familia 
				 FROM familia, rel_famesp_articles
				 WHERE rel_famesp_articles.codi_familia=familia.codi_familia
				 AND codi_familia_especial=".$codi_fam_esp;
$qry_familia = mysql_query($sql_familia);
?>
	<table width="100%" height="90%"cellpadding="0" cellspacing="0" border="1">
		<tr valign="middle">
		<? 
			while ($row_familia = mysql_fetch_array($qry_familia)){ 
			$codifamilia=$row_familia[codi_familia];
			$i++;
		?>
		<td align="center">
<div id="<? echo $i ?>" name="<? echo $i?>" align="center"OnMouseOver="mano(this)" onMouseOut="flecha(this)" STYLE="text-align:center;font-family:Verdana, Arial, Helvetica, sans-serif; height:35;font-size:11px;background:#CCCCCC;" onClick="abrir('articles.php?codifamilia=<? echo $codifamilia?>&codi_fam_esp=<? echo $codi_fam_esp?>','<? echo $i ?>')"><? echo $row_familia[nom_familia]; ?></div>
		</td>
		<? } ?>
		
	</tr>
	</table>
</td>
</tr>
</table>
</body>
</html> 
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier

Última edición por sergi_climent; 31/01/2006 a las 08:13
  #16 (permalink)  
Antiguo 31/01/2006, 08:48
Avatar de ludovico2000  
Fecha de Ingreso: noviembre-2003
Ubicación: Bizkaia
Mensajes: 1.315
Antigüedad: 12 años, 10 meses
Puntos: 2
......pues no sé cómo se podría hacer entonces... igual la derecha acaba siendo utilizar imágenes que hacen rollover y ya está...

Última edición por ludovico2000; 14/02/2006 a las 12:27
  #17 (permalink)  
Antiguo 06/02/2006, 01:11
Avatar de Acadio  
Fecha de Ingreso: octubre-2005
Mensajes: 48
Antigüedad: 10 años, 11 meses
Puntos: 0
Mira este ejemplo, es muy bueno http://www.webintenta.com/Cambiar-el...mouseover.html
  #18 (permalink)  
Antiguo 13/02/2006, 04:48
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 11 años, 8 meses
Puntos: 10
una cosa mas...
si el menu recarga sobre la misma pagina me pierde la propiedad del cambio de color.
Como puedo solucionarlo?

Grácias de antemano,

Saludos
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
  #19 (permalink)  
Antiguo 14/02/2006, 10:17
Avatar de Acadio  
Fecha de Ingreso: octubre-2005
Mensajes: 48
Antigüedad: 10 años, 11 meses
Puntos: 0
Pasale una variable del menu que fue marcado cada vez por POST y al recargar la pagina, ese tendra que tener la clase que le corresponda a cuando esta marcado.

Un saludo.
  #20 (permalink)  
Antiguo 01/03/2006, 01:06
 
Fecha de Ingreso: enero-2005
Ubicación: Barcelona
Mensajes: 1.473
Antigüedad: 11 años, 8 meses
Puntos: 10
Pregunta

hola de nuevo...
he vuelto otra vez con este tema.. ya q lo deje x q tenia otro trabajo mas importante q un cambio d colores...
tengo el siguiente codigo en javascript:
Código:
<script>
	var pepe=null; //***
	function mano(cual){
	document.body.style.cursor='hand';
	cual.style.backgroundColor='#0A81CA';
	cual.style.color='#FFFFFF';
	cual.style.fontSize='11px';
	}
	
	 function flecha(cual){
		document.body.style.cursor='default';
		cual.style.backgroundColor=(cual==pepe)?'#0A81CA':'#002E5E';
		cual.style.color=(cual==pepe)?'#FFFFFF':'#000000';
		cual.style.fontSize='11px';
	}
	
	function abrir(pag,e){
	elemento = document.getElementById(e);
	if (pepe){
		pepe.style.backgroundColor='#002E5E';
		pepe.style.color='#000000';
		pepe.style.fontSize='11px';
		}
		pepe = elemento; //***
		elemento.style.backgroundColor = '#0A81CA';	
		elemento.style.color='#FFFFFF';
		elemento.style.fontSize='11px';
		window.parent.frames[1].location.href=pag;
	}
</script>
y lo llamo desde un div q lo creo dinamicamente:
Código HTML:
<div id="<? echo $row_articles[codi_article] ?>" align="center" STYLE="font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px;background:#002E5E;width:110px;" name="<? echo $row_articles[codi_article] ?>" OnMouseOver="mano(this)" onMouseOut="flecha(this)" onClick="abrir('ficha.php?codiarticle=<? echo $row_articles[codi_article]?>&codifamilia=<? echo $codifamilia?>','<? echo $row_articles[codi_article] ?>')"> 
como hago para pasar la variable javascript cuando recargo la misma pagina?

Gracias de antemano,

Saludos
__________________
"Cada hombre es el hijo de su propio trabajo"
Miguel de Cervantes Saavedra
"La experiencia es algo que no consigues hasta justo depués de necesitarla"
Laurence Olivier
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 12:49.