Tabs o pestañas en html

[karnaldo]

Hola chic@s necesito ayuda con pestañas o tabs, como le quieran llamar

Resulta que ya tengo un html con tabs sin embargo quiero que funcione similar a esta pagina:
Ejemplo

Que en el contenido de la tab activa aparezca un link que pueda abrir otra tab en la misma pagina... no se si comprenden la idea, solo que no quiero usar js, por eso me preguntaba si saben como hacerlo en html alguna ayuda??? se los agradecería.

O si conocen una mejor manera de hacerlo en JS diganmelo tambien, de antemano muchas gracias.

[pzin]

Según ese ejemplo concreto bastaría con que pusieras un enlace de este tipo:

Código HTML:

<a href="#css" onclick="mostrarPestaña(pestañas, this); return false">abrir pestaña CSS</a>
 

Que es la misma forma que usa esa misma página.

[Trublux]

Se podría hacer con el pseudo selector de CSS3 ":target", aunque no lo soportan todos los navegadores.
Aquí hay un ejemplo de cómo se puede usar: CSS3-Only Tabbed Area

[IsaBelM]

aquí tienes uno con la pseudo-clase :checked (no es soportado por i8-). elimina el javascript no afecta al resultado

[emprear]

Iniciado por karnaldo

Hola chic@s necesito ayuda con pestañas o tabs, como le quieran llamar

Resulta que ya tengo un html con tabs sin embargo quiero que funcione similar a esta pagina:
Ejemplo

Que en el contenido de la tab activa aparezca un link que pueda abrir otra tab en la misma pagina... no se si comprenden la idea, solo que no quiero usar js, por eso me preguntaba si saben como hacerlo en html alguna ayuda??? se los agradecería.

O si conocen una mejor manera de hacerlo en JS diganmelo tambien, de antemano muchas gracias.

Los sistemas de pestañas basicamente tienen 2 funcionamientos, en uno todos los contenidos están definidos en la misma página, entonces lo que se hace es mostrar un contenido en tanto el otro permanece ocultos, para este tipo, y sin utilizar javascript el indicado por @IsabelM es uno de los más tradcionales.

Pero como estás hablando de "links", tu planteo genera una duda, no sé si con eso te referís a que el contenido del tab se carga de un archivo externo. Si este es el caso, entonces deberás a recurrir a Ajax, es decir, javascript. (desde ya que jQuery te simplificaría el trabajo

Sería bueno que precises tu caso

SAlu2

[karnaldo]

Iniciado por IsaBelM

aquí tienes uno con la pseudo-clase :checked (no es soportado por i8-). elimina el javascript no afecta al resultado

Muchas gracias a todos y a @IsaBelM creo que me funciona bien con ese ejemplo, voy a ver q puedo hacer para IE8

[karnaldo]

Lamentablemente no me funciono
ahora creo q es un poco mas complicado, resulta que en las tab hay un image map entonces cada vez q se clickee una parte de la imagen el link debe "activar" la tab q se "clickeo" desde el image map... alguna idea de como hacerlo???? Gracias.

[caricatos]

Hola:

Las áreas en los mapas de imágenes son exactamente igual a cualquier enlace... solo tendrías que usar el mismo href que tenga la pestaña.

Saludos

[karnaldo]

Iniciado por caricatos

Hola:

Las áreas en los mapas de imágenes son exactamente igual a cualquier enlace... solo tendrías que usar el mismo href que tenga la pestaña.

Saludos

Lo que pasa es que estoy usando este tipo de tabs los cuales no usan href

Código HTML:

 <input type="radio" id="tab-1" name="tab-group-1" checked>
       <label for="tab-1">Contenido 1</label>