JS:
$ (". con"). eq (0) .show (); $ (". btn span"). cliquez (fonction () {var num = $ (". btn span"). index (this); $ (". con"). hide (); $ (". con"). eq (num) .show (). slllings (). hide ();})CSS:
Body {Cursor: par défaut; -webkit-text-size-ajustement: aucun; taille de police: 12px; Font-Family: Arial; Contexte: #FFF; } .clear {zoom: 1; } .clear: après {visibilité: cachée; Affichage: bloc; taille de police: 0; Contenu: "1"; Clear: les deux; hauteur: 0; } .main {width: 500px; marge: 20px automatique; } .btn span {width: 35px; Texte-aligne: Centre; Couleur: #FFF; Contexte: # F00; curseur: pointeur; marge: 0 5px; Affichage: bloc; flottant: à gauche; } .con {affichage: aucun; Border: # 033 1px solide; hauteur: 100px; Largeur: 200px; }HTML:
<div> <div> <span> 1 </span> <span> 2 </span> <span> 3 </span> </div> <div> First <br /> </div> <div> seconde <br /> </div> <v> seconde <r /> </div> <div> troisième <br /> </div> </div>
capture d'écran
Le code d'exemple de commutation d'onglet le plus simple ci-dessus est tout le contenu que je partage avec vous. J'espère que vous pourrez vous faire référence et j'espère que vous pourrez soutenir Wulin.com plus.