borde en celdas

javihb · #1 (**permalink**) 29/04/2005, 08:09

Hola amigos, vereis tengo echo un menu con javascript y estilos, son 2 tablas, una es la que contiene a otra que es la que lleva el menu y me gustaria saber como hacer para que al pasar el raton se marque la celda con su borde pero no se desplaze....Gracies

Este es el codigo

Código:

<html>
<head>
	<title>Untitled</title>
	<style type="text/css">
<!--

.Navlink {COLOR: #808080; TEXT-DECORATION: none; font-family: arial; font-size: 10pt; font-weight: bold;}
a:link.Navlink  {color : #ffffff;}
a:visited.Navlink  {color : #ffffff;}
a:active.Navlink  {text-decoration: none;}
a:hover.Navlink  {text-decoration: none;}

-->
</style>
<script language = "javascript">
<!--

function LmOver(elem, clr)
{elem.style.backgroundColor = clr;
elem.children.tags('A')[0].style.color = "blue";
elem.style.cursor = 'hand';
elem.style.border='solid white 1';}

function LmOut(elem, clr)
{elem.style.backgroundColor = 'transparent';
elem.children.tags('A')[0].style.color = "#ffffff";
elem.style.border='none';}

function LmDown(elem, clr)
{elem.style.backgroundColor = clr;
elem.children.tags('A')[0].style.color = "#FFFFFF";}

function LmUp(path)
{location.href = path;}

//-->
</script>

</head>

<body bottommargin="0" leftmargin="0" marginheight="0" marginwidth="0" rightmargin="0" topmargin="0">
<table border="0" width="100%" cellspacing="0" cellpadding="0"  height="34" bgcolor="#0000ff">
<tr>
<td width="100%">
<table align="center" border="0" width="100%" cellspacing="0" cellpadding="0" height="16">
<tr>
  <td align="center" onMouseover="LmOver(this, '#94C7F1')" onMouseout="LmOut(this, '#FFFFFF')" onMouseDown="LmDown(this, '#9999FF')" 
onMouseUp="LmUp('pagina_pruebas.htm')"><A HREF="pagina_pruebas.htm" Class="navlink">  Link ejemplo</a></td>
<td> | </td>
  <td align="center" onMouseover="LmOver(this, '#94C7F1')" onMouseout="LmOut(this, '#FFFFFF')" onMouseDown="LmDown(this, '#9999FF')" 
onMouseUp="LmUp('pagina_pruebas.htm')"><A HREF="pagina_pruebas.htm" Class="navlink">  Link ejemplo</a></td>
<td> | </td>
  <td align="center" onMouseover="LmOver(this, '#94C7F1')" onMouseout="LmOut(this, '#FFFFFF')" onMouseDown="LmDown(this, '#9999FF')" 
onMouseUp="LmUp('pagina_pruebas.htm')" ><A HREF="pagina_pruebas.htm" Class="navlink">  Link ejemplo</a></td>
<td> | </td>
<td align="center" onMouseover="LmOver(this, '#94C7F1')" onMouseout="LmOut(this, '#FFFFFF')" onMouseDown="LmDown(this, '#9999FF')" 
onMouseUp="LmUp('pagina_pruebas.htm')" ><A HREF="pagina_pruebas.htm" Class="navlink">  Link ejemplo</a></td>
</tr>
</table>
</td>
</tr>
</table>



</body>
</html>

Santiago Cortes · #2 (**permalink**) 29/04/2005, 09:10

Algo sensillo y sin menos condigo compadre checalo y me dices paciencia:
<style>
#sectionLinks a:link, #sectionLinks a:visited { display:block; background:#cccccc; background-image:url(images/menu1.gif); font-weight:bold; padding: 0px 0px 0px 0px; color:#333333; }
#sectionLinks a:hover{ background-color:#DEDDDD; background-image:none; font-weight:bold; text-decoration:none; color:#AA0000; }

</style>
<div id="sectionLinks">
<table width="150" border="0" cellpadding="0" cellspacing="0" bgcolor="#DEDDDD">
<tr>
<td width="153" height="17"><a class="menuhorizantal" href="?ver=deportes"><img src="images/play.gif" width="14" height="14" border="0"> Deportes</a></td>
</tr>
</div>

///////////////////////////////////

Es algo mas sencillo y rapido y sin tanto problema.

Atte. Santiago A. Cortes Molina
Chetumal, Quintana Roo

Santiago Cortes · #3 (**permalink**) 29/04/2005, 09:20

Se me olvido mencionar que la parte donde dice "background-image:url(images/menu1.gif".

lo puedes poner con una imagen que tu selecciones o el color que quieras ademas lo puedes configurara con imagen primaria y otra secundaria con bordes y es mas sencillo y menos codgio, recuerda que mientras menos codigo, mejor para tu pagina ya que no la cargas, tanto

Atte. Santiago A. Cortes Molina
Chetumal Quintana Roo.