Foros del Web » Creando para Internet » CSS »

Enlazar Celdas

Estas en el tema de Enlazar Celdas en el foro de CSS en Foros del Web. Hola: Quisiera saber si hay alguna posibilidad de enlazar celdas de tablas y que sea compatible con IE / Firefox / Opera Una forma que ...
  #1 (permalink)  
Antiguo 23/06/2006, 16:51
 
Fecha de Ingreso: junio-2004
Mensajes: 101
Antigüedad: 13 años, 6 meses
Puntos: 0
Exclamación Enlazar Celdas

Hola:


Quisiera saber si hay alguna posibilidad de enlazar celdas de tablas y que sea compatible con IE / Firefox / Opera

Una forma que se que no es correcta es esta:

Código HTML:
<a href="enlace/index.html">
 <TD class=cellaout id=cella0 align=middle width="93" valign="top" > 
          <div class="enlace_tab">TEXTO</div>
          
</TD>
</a> 
ademas que solo funciona para IE

Necesito poder enlazar toda la celda no solo en contenido (texto) que aparesca en ella sino que al hacer clic sobre culquier parte de la celda me sirva como link a una página.

No se si esto es posible con algún evento javascripts


Saludos...........
  #2 (permalink)  
Antiguo 23/06/2006, 18:14
Avatar de PatomaS
Colaborador
 
Fecha de Ingreso: marzo-2004
Ubicación: En alguna otra parte
Mensajes: 4.656
Antigüedad: 13 años, 9 meses
Puntos: 63
Hola

Las especificaciones actuales no permiten hacer lo que quieres, sin embargo, puedes lograr el efecto que deseas mediante el uso de capas invisibles con una imagen transparente del tamaño que deses y vinculando la imagen, de esa manera, el usuario "verá" toda la celda vinculada.

Felicidad
__________________
¡ hey, hou, hou, hey !
  #3 (permalink)  
Antiguo 24/06/2006, 03:13
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Hola a todos.

Puedes poner el enlace dentro de la celda:

<td><a href="pagina.html">Enlace</a></td>

y utilizar Css para que ocupe todo el espacio:

td a {width:100%; height:100%; display:block}

Saludos,
  #4 (permalink)  
Antiguo 24/06/2006, 16:51
 
Fecha de Ingreso: junio-2004
Mensajes: 101
Antigüedad: 13 años, 6 meses
Puntos: 0
De acuerdo Re:

Gracias por las respuestas

Las probare y supongo que al ser CSS sera compatible con Firefox y Opera


Saludos
  #5 (permalink)  
Antiguo 25/06/2006, 04:26
Avatar de PatomaS
Colaborador
 
Fecha de Ingreso: marzo-2004
Ubicación: En alguna otra parte
Mensajes: 4.656
Antigüedad: 13 años, 9 meses
Puntos: 63
Hola

SI, en principio es compatible con todos los navegadores.

La única posible pega, tiene que ver con los límites que algunos navegadores le asignan a los bloques de los vínculo, pudiendo sobreponerse un poquito el área de dos celdas contigüas o más bien quedarse un poquito corto respecto al borde que ves de las celdas.

Pero podemos decir en general que la solución que te puso JavierB es muy buena.

:)

Felicidad
__________________
¡ hey, hou, hou, hey !

Última edición por PatomaS; 25/06/2006 a las 09:39
  #6 (permalink)  
Antiguo 25/06/2006, 15:10
 
Fecha de Ingreso: junio-2004
Mensajes: 101
Antigüedad: 13 años, 6 meses
Puntos: 0
Mensaje Re:

Hola:


He probado el codigo pero no tengo el resultado deseado, me enlaza el contenido de la celda pero solo hasta el limite del texto

Es decir que si el texto no ucupa toda la celda no tengo el efecto desado de enlazar toda la celda

no se si influye el que use DIV dentro de la celda
y tiene el mismo efecto en Firefox


Código HTML:
<table width="235" height="125" border="2" align="center" cellpadding="0" cellspacing="0">
  <tr> 
  
 <td width="82" height="125" bordercolor="#333333" border="1">

	<a href="index.html">
<div>texto 1</div>
<div>texto 2</div>
</a>
</td> 

Y la primera solución que me proponen, lo intente pero no tuvo exito
quizas podrian mostrarme un ejemplo


Me seria util

Saludos
  #7 (permalink)  
Antiguo 26/06/2006, 01:59
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Hola de nuevo.

Te pongo un ejemplo completo. Está probado en IE, Firefox y Opera:
Código PHP:
<html>
<
head>
<
style type="text/css">
table {width:300pxborder-collapse:collapse}
td {border:1px solid black}
td a {width:100%; height:100%; display:block}
td a:hover {background:red}
</
style>
</
head>
<
body>
<
table>
<
tr>
<
td><a href="pagina1.html">Enlace 1</a></td>
<
td><a href="pagina2.html">Enlace 2</a></td>
</
tr>
</
table>
</
body>
</
html
Saludos,
  #8 (permalink)  
Antiguo 26/06/2006, 15:38
 
Fecha de Ingreso: junio-2004
Mensajes: 101
Antigüedad: 13 años, 6 meses
Puntos: 0
Mensaje Re:

Gracias por el ejemplo me a sido de gran ayuda


Saludos
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 11:00.