Foros del Web » Creando para Internet » HTML »

enlace en celda de tabla

Estas en el tema de enlace en celda de tabla en el foro de HTML en Foros del Web. Hola a todos Me gustaria saber como hago para que al hacer click sobre celda de una tabla me destine a otra pagina. O sea ...
  #1 (permalink)  
Antiguo 25/09/2006, 11:11
 
Fecha de Ingreso: diciembre-2005
Ubicación: Barcelona
Mensajes: 1.428
Antigüedad: 12 años
Puntos: 15
enlace en celda de tabla

Hola a todos

Me gustaria saber como hago para que al hacer click sobre celda de una tabla me destine a otra pagina.
O sea que toda la celda sea clickeable y no solo el texto que está dentro de la celda

<td align="left" valign="middle" background="Images/cuerpo1_barr_lat.gif">&nbsp;&nbsp;<span id="t1_1_11" class="ArialBold12">Portfolio</span></td>f
gracias
  #2 (permalink)  
Antiguo 25/09/2006, 11:15
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 10 meses
Puntos: 771
Hola chefnelone
Código:
<td onclick = "location='tupagina.html'"...
Saludos,
  #3 (permalink)  
Antiguo 25/09/2006, 11:55
 
Fecha de Ingreso: diciembre-2005
Ubicación: Barcelona
Mensajes: 1.428
Antigüedad: 12 años
Puntos: 15
gracias javier
me funciona... pero a medias. No aparece la mano( que indica que se pueda hacer click) y no se porque tengo que hacer 2 clicks para que funcione.
YO sabia que con dreamweaver se podian crear un area que para hacer click en cualquier lugar de pagina. No me acuerdo si es <div> y en las busquedas no se como buscarlo
  #4 (permalink)  
Antiguo 25/09/2006, 12:09
Avatar de braulito  
Fecha de Ingreso: abril-2004
Ubicación: Cusco - Perú
Mensajes: 597
Antigüedad: 13 años, 7 meses
Puntos: 8
Para que aparezca la mano:
Código:
td.link {
 cursor: pointer;
}
Código HTML:
<td clas="link" onclick="location='tupagina.html'" ...
Lo malo de todo esto es que el código está totalmente desordenado...
__________________
Braulio Soncco
braulio at buayacorp dot com
Buayacorp - Programación y Diseño
  #5 (permalink)  
Antiguo 25/09/2006, 13:29
Avatar de fer10  
Fecha de Ingreso: octubre-2005
Ubicación: Guadalajara - Mexico
Mensajes: 905
Antigüedad: 12 años, 2 meses
Puntos: 3
por que no metes un link como bloque es mas accesible y da mejores resultados que poner una td con javascript. y sin mencioanar sus posteriores mejoras..
__________________
Saludos
FT.
www.fernando.com.mx
  #6 (permalink)  
Antiguo 25/09/2006, 16:00
 
Fecha de Ingreso: diciembre-2005
Ubicación: Barcelona
Mensajes: 1.428
Antigüedad: 12 años
Puntos: 15
me explicarias como es esto del link como un bloque
  #7 (permalink)  
Antiguo 25/09/2006, 17:54
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
dentro de tu tabla pon tal cual un a.

<td>
<a href="otro.htm" style="display: block; width: 120px; height: 60px; background-color: red;">
</td>
  #8 (permalink)  
Antiguo 25/09/2006, 17:56
Avatar de fer10  
Fecha de Ingreso: octubre-2005
Ubicación: Guadalajara - Mexico
Mensajes: 905
Antigüedad: 12 años, 2 meses
Puntos: 3
css:
Cita:
.link{
width:100px;
height:100px;
}
.link a{
display:block;
height:100px;
background-color:#C0C0C0;
}
.link a:hover{background-color:#E0E0E0;}
html
Código HTML:
<table>
<tr>
	<td  class="link" ><a href="#">td1</a></td>
	<td>td12</td>
</tr>
<tr>
	<td>td3</td>
	<td>td4</td>
</tr>
</table> 
__________________
Saludos
FT.
www.fernando.com.mx
  #9 (permalink)  
Antiguo 26/09/2006, 04:23
 
Fecha de Ingreso: diciembre-2005
Ubicación: Barcelona
Mensajes: 1.428
Antigüedad: 12 años
Puntos: 15
gracias fer.
lo hecho tal cual y funciona bien ....pero el texto me queda alineado arriba (TOP) verticalmente.
he probado de todo pero no lo puedo CENTRAR.

<td class="link" width="121" height="41" align="center" valign="middle" background="Images/Boton.gif"><a href="#">Estimates</a></td>-

.link{
width:121px;
height:41px;
}
.link a{
display:block;
width:121px;
height:41px;
}
  #10 (permalink)  
Antiguo 26/09/2006, 10:39
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Aunque no sea Fer, y despreciaste mi opción :(
.link a{
display:block;
padding: 10px 20px;
}
Juega con eso.
  #11 (permalink)  
Antiguo 26/09/2006, 11:05
Avatar de fer10  
Fecha de Ingreso: octubre-2005
Ubicación: Guadalajara - Mexico
Mensajes: 905
Antigüedad: 12 años, 2 meses
Puntos: 3
jejej Rafael no me avia dado cuenta que ya avias puesto repuesta, a la mejor cuando hacia el documento pusiste tu el post... =(


effecitamente como dice Rafael usa paddings para acomodarlo..

lo que pasa es que tu estas poniendo la alineacion a la celda(td) pero ya a hora el link es tipo bloque, y el link mide lo que mide la celda de ancho y alto. entonces peudes alinearlo necesitas darle padding espacios dentro del objeto.

utlisa 4 valores para que entiendas mejor:
padding: 10px 20px 10px 20px;
el primero es top,right,bottom,left hacia las manellitas del reloj.

si pones 3
padding: 10px 20px 10px;
el primero es top, right &left , bottom

si pones 2:
padding: 10px 20px;
top & bottom , left & right

si pones 1:
aplica para todos igual.


nota: recuerda que existe un error al modelado de cajas con los paddings en ie "hack box model"
http://www.google.com.mx/search?hs=q...a=lr%3Dlang_es
el primer enlace te puede servir
http://www.torresburriel.com/box-model-hack.html
__________________
Saludos
FT.
www.fernando.com.mx

Última edición por fer10; 26/09/2006 a las 11:42
  #12 (permalink)  
Antiguo 26/09/2006, 12:08
 
Fecha de Ingreso: diciembre-2005
Ubicación: Barcelona
Mensajes: 1.428
Antigüedad: 12 años
Puntos: 15
gracias ya voy a probar.

..y perdona rafael, no quise herir tus sentimientos . . (tomo los codigo con los que mi siento mas familiarizado...o sea que los entienda)
  #13 (permalink)  
Antiguo 26/09/2006, 12:14
Avatar de AlZuwaga
Colaborador
 
Fecha de Ingreso: febrero-2001
Ubicación: 34.517 S, 58.500 O
Mensajes: 14.550
Antigüedad: 16 años, 9 meses
Puntos: 535
para alinear el texto dentro de "la caja"... ¿no conviene usar text-align (para el alineamiento horizontal) y un line-height con la mitad del alto de "la caja" (para el vertical)?
__________________
...___...
  #14 (permalink)  
Antiguo 26/09/2006, 13:35
Avatar de fer10  
Fecha de Ingreso: octubre-2005
Ubicación: Guadalajara - Mexico
Mensajes: 905
Antigüedad: 12 años, 2 meses
Puntos: 3
line-height no sirve si tiene mas de 2 lineas ya que ese solo es el tamaño de la linea..

pero igual y funciona depende lo que tengas dentro de ella si solo tienes una linea =).
__________________
Saludos
FT.
www.fernando.com.mx
  #15 (permalink)  
Antiguo 26/09/2006, 13:54
Avatar de AlZuwaga
Colaborador
 
Fecha de Ingreso: febrero-2001
Ubicación: 34.517 S, 58.500 O
Mensajes: 14.550
Antigüedad: 16 años, 9 meses
Puntos: 535
Es cierto, había olvidado que sólo sirve cuando es sólo una línea. Además me confundí al decir que debe ser de la mitad del tamaño, debe ser del mismo alto.
__________________
...___...
  #16 (permalink)  
Antiguo 27/09/2006, 10:09
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
No estoy herido para nada. Al contrario, me obliga a poner explicaciones más claras.

Y si Fer, coincidimos varias veces a la hora que entramos al foro :).
Al Zuwaga, bien por proponer alternativas, así todos exploramos.
  #17 (permalink)  
Antiguo 27/09/2006, 15:19
Avatar de anthemfor182  
Fecha de Ingreso: enero-2006
Ubicación: Colombia
Mensajes: 73
Antigüedad: 11 años, 11 meses
Puntos: 2
Yo lo haría asi:

<td align="left" valign="middle"
background="Images/cuerpo1_barr_lat.gif"
style='cursor: pointer' onclick='window.location="url"'
>&nbsp;&nbsp;
<span id="t1_1_11" class="ArialBold12">Portfolio</span>
</td>

Espero sirva
  #18 (permalink)  
Antiguo 27/09/2006, 16:18
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Respetable, aunque no veo necesidad de poner un gif, y usar javaScript en este caso.
  #19 (permalink)  
Antiguo 28/09/2006, 07:17
 
Fecha de Ingreso: diciembre-2005
Ubicación: Barcelona
Mensajes: 1.428
Antigüedad: 12 años
Puntos: 15
lo he solucionado (o emparchado ) poniendo todo poniendo <a ...> una tabla completa</a>

Parece que con una tabla completa es mas facil que con una celda.

Seguro que no es la mejor solucion pero me funcionó

gracias
  #20 (permalink)  
Antiguo 28/09/2006, 11:25
Avatar de fer10  
Fecha de Ingreso: octubre-2005
Ubicación: Guadalajara - Mexico
Mensajes: 905
Antigüedad: 12 años, 2 meses
Puntos: 3
un elemento en linea y dentro un bloque..

yo tampoco creo que sea una buena solucion..
__________________
Saludos
FT.
www.fernando.com.mx
  #21 (permalink)  
Antiguo 29/09/2006, 18:15
 
Fecha de Ingreso: septiembre-2006
Mensajes: 15
Antigüedad: 11 años, 2 meses
Puntos: 0
Lo ideal es hacer un display: block; con css en <TD> y dentro de la celda hacer un <A...>&nbps;</a> (o algo asi).

Teniendo A el ancho y alto de la celda (tb por css)
  #22 (permalink)  
Antiguo 29/09/2006, 19:51
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Un td ya es un bloque en cierto modo. No.

Lo que comenta Fer y lo que comento yo, no creo que sea encontrar artificios que pueden funcionar, pero no son correctos.

Un a de bloque dentro del td y ya.
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:34.