JS:
$ (". Con"). Eq (0) .show (); $ (". Btn Span"). Click (function () {var num = $ (". Btn Span"). index (this); $ (". Con"). Hide (); $ (". Con"). Eq (num) .show (). Slblings (). Hide ();})CSS:
cuerpo {cursor: predeterminado; -webkit-text-size-adjust: Ninguno; tamaño de fuente: 12px; Font-Family: Arial; Antecedentes: #fff; } .clar {zoom: 1; } .clar: después de {visibilidad: oculto; Pantalla: bloque; tamaño de fuente: 0; Contenido: "1"; claro: ambos; Altura: 0; } .main {ancho: 500px; Margen: 20px Auto; } .btn span {ancho: 35px; Text-Align: Center; Color: #fff; Antecedentes:#F00; cursor: puntero; margen: 0 5px; Pantalla: bloque; flotante: izquierda; } .con {display: none; borde:#033 1px sólido; Altura: 100px; Ancho: 200px; }HTML:
<Div> <Viv> <span> 1 </span> <span> 2 </span> <span> 3 </span> </div> <div> primero <Br/> </div> <div> segundo <Br/> </div> <Div> Second <Br/> </div> <Viv> Tercer <Br/> </div> </div> </div> </div> </div> </div>
captura de pantalla
El código de ejemplo de conmutación de pestaña más simple es todo el contenido que comparto con usted. Espero que pueda darle una referencia y espero que pueda apoyar más a Wulin.com.