Foros del Web - Ver Mensaje Individual

kseso? · #11 (**permalink**) 30/12/2011, 15:25

soriaromanm:
Visto que se decanta por utilizar js, creo que le convendría pedir le trasladen su consulta al foro correspondiente.

Cita:

Iniciado por aleksdj

Creo que la mejor solucion es usar la libreria jquery para evitar problemas de compatibilidad hacia atrás, con cualquiera de los métodos expuestos es suficiente, yo usaria el método toggle() del jquery que te da el mismo resultado con menos código.salu2

Eso es sin contar todo el código de la librería. Supongo.

Todo lo anterior sólo es a efectos introductorios de un ejemplo realizado con css.
Sólo a efectos de ilustrar la pseudoclase :checked. El funcionamiento de los inputs y otras cuestiones no las contemplo:

Código HTML:

Ver original<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>Kseso? jugando con css</title>
<style type="text/css">
form {
  position: relative;
  width: 200px;
  border: 1px solid blue;
}
[type=radio] ~ label ~ div {display: none;}
[type=radio]:checked ~ label ~ div {display: block;}
 </style>
</head>
<body>
      <form>
       <input type="radio" id="tab-1" name="tab-group-1" checked>
       <label for="tab-1">Label 1</label>
          <div>  
            <input type="radio" id="tab-1_1" name="tab-group-1">
            <label for="tab-1_1">Label 1.2</label>
            <input type="radio" id="tab-1_2" name="tab-group-1">
            <label for="tab-1_2">Label 1.3</label>
          </div>       
      </form>
</body>
</html>