Foros del Web » Creando para Internet » CSS »

Tabcontrol sin javascript

Estas en el tema de Tabcontrol sin javascript en el foro de CSS en Foros del Web. Hola, foreros: He estado buscando un tabcontrol (botones que al clicar en ellos se muestra un div u otro sin volver a cargar la web ...
  #1 (permalink)  
Antiguo 15/05/2008, 14:28
Avatar de salbatore  
Fecha de Ingreso: abril-2007
Ubicación: Springfield
Mensajes: 1.566
Antigüedad: 10 años, 8 meses
Puntos: 19
Tabcontrol sin javascript

Hola, foreros:

He estado buscando un tabcontrol (botones que al clicar en ellos se muestra un div u otro sin volver a cargar la web de nuevo), pero todos los que he encontrado son utilizando javascript ajax u otros.

Lo que busco es un sistema hecho solo con css.

Como esto, pero sin ajax, solo css:

http://www.asp.net/ajax/ajaxcontrolt...Tabs/Tabs.aspx

¿Se puede hacer?
  #2 (permalink)  
Antiguo 16/05/2008, 07:14
Avatar de Raulmmmm  
Fecha de Ingreso: marzo-2007
Ubicación: En otro lugar que tú
Mensajes: 1.549
Antigüedad: 10 años, 8 meses
Puntos: 36
Respuesta: Tabcontrol sin javascript

Pinchando no, sólo pasando el ratón por encima:
http://www.cssplay.co.uk/menu/one_page.html
  #3 (permalink)  
Antiguo 20/05/2008, 09:21
Avatar de salbatore  
Fecha de Ingreso: abril-2007
Ubicación: Springfield
Mensajes: 1.566
Antigüedad: 10 años, 8 meses
Puntos: 19
Respuesta: Tabcontrol sin javascript

Hola, de nuevo...

Es una pena, jeje. ¿No se puede conseguir por medio de la opcion active?
  #4 (permalink)  
Antiguo 20/05/2008, 12:58
Avatar de Raulmmmm  
Fecha de Ingreso: marzo-2007
Ubicación: En otro lugar que tú
Mensajes: 1.549
Antigüedad: 10 años, 8 meses
Puntos: 36
Respuesta: Tabcontrol sin javascript

Es que con :active sólo se ve la parte de abajo mientras mantienes presionado el tab...
  #5 (permalink)  
Antiguo 20/05/2008, 18:21
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Tabcontrol sin javascript

Cita:
Iniciado por Raulmmmm Ver Mensaje
Es que con :active sólo se ve la parte de abajo mientras mantienes presionado el tab...
Eso ocure en FF, porque en explorer el active mantiene cuando dejas de pulsar. El equivalente para firefox es focus, que se mantiene después de pulsar.

salbatore:

Mírate este en lace

http://www.forosdelweb.com/f95/parti...5/#post2376290

Tiene algo de más que lo que tú buscas, pero precisamente se trataría de simplificar. Si algo no lo entiendes me preguntas y veo cómo simplificarlo.

Mikel.
  #6 (permalink)  
Antiguo 22/05/2008, 03:45
Avatar de salbatore  
Fecha de Ingreso: abril-2007
Ubicación: Springfield
Mensajes: 1.566
Antigüedad: 10 años, 8 meses
Puntos: 19
Respuesta: Tabcontrol sin javascript

Hola, de nuevo...

Buff, Mikmoro, menudo ejemplo mas sobrado, jeje. Ahora poco a poco ire viendo como hacerlo...

Muchas gracias...
  #7 (permalink)  
Antiguo 22/05/2008, 04:08
Avatar de salbatore  
Fecha de Ingreso: abril-2007
Ubicación: Springfield
Mensajes: 1.566
Antigüedad: 10 años, 8 meses
Puntos: 19
Respuesta: Tabcontrol sin javascript

Hola, Mikmoro...

Estoy viendo tu codigo y me gusta demasiado, jeje. Solo veo un unico problema.

¿Existe alguna posibilidad de que al clicar fuera del div de cada pestaña no se desactive y se oculte el contenido?, es decir, que cuando cliques una vez activada una pestaña fuera de ella esta se oculte.

¿Se puede?
  #8 (permalink)  
Antiguo 22/05/2008, 04:23
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Tabcontrol sin javascript

Cita:
Iniciado por salbatore Ver Mensaje
¿Existe alguna posibilidad de que al clicar fuera del div de cada pestaña no se desactive y se oculte el contenido?, es decir, que cuando cliques una vez activada una pestaña fuera de ella esta se oculte.

¿Se puede?
Hola, salbatore.

Me parece que estás preguntando dos cosas contrarias:

1.- "al clicar fuera del div de cada pestaña no se desactive y se oculte"
2.- "cuando cliques una vez activada una pestaña fuera de ella esta se oculte"

La segunda pregunta es justo lo contrario de la primera.

En cualqueir caso, a la primera pregunta no, no se puede sólo con css, porque se activan con los pseudo elementos "active" y "focus", de manera que cuando una pestaña deje de estar activa o pierda el foco se desactivará.

Desgraciadamente esto funciona mal en IE6. Un día de estos intentaré resolverlo.

Mikel.
  #9 (permalink)  
Antiguo 22/05/2008, 05:48
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Tabcontrol sin javascript

Hola otra vez.

Aquí he puesto un ejemplo mucho más simple de tabs con css, que seguramente será mucho más fácil de entender y aplicar.

Lo que más me gusta es que no necesita comentarios condicionales ni hacks para Explorer. Afinando bien he conseguido hacerlo compatible a FF, IE6 e IE7 sin filigranas.

Mikel.
  #10 (permalink)  
Antiguo 23/05/2008, 10:50
Avatar de salbatore  
Fecha de Ingreso: abril-2007
Ubicación: Springfield
Mensajes: 1.566
Antigüedad: 10 años, 8 meses
Puntos: 19
Respuesta: Tabcontrol sin javascript

Hola, Mikmoro...

Esta perfecto como lo has dejado, me gusta un monton...

Muchas gracias... lo guapo es que es supersencillo, sin java... jeje...

Gracias crack!
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:40.