Implementar la aplicación de la pestaña, este complemento es relativamente simple
Archivo del código fuente:
tab.js
Principio de implementación
1. Al hacer clic en un elemento, primero cancele el elemento resaltado originalmente.
2. Luego resalte el elemento hecho hecho
3. Si hacer clic en un elemento es una opción en el cuadro desplegable, seleccione y seleccione también el cuadro desplegable.
5. Si se define la animación, ejecute la animación primero y luego la devolución de llamada
Análisis del código fuente:
1. El método de espectáculo se activa cuando se hace clic en un elemento, lo que activará los siguientes cuatro eventos.
1.1. Hiden.bs.tab: ocultar el elemento anterior
1.2. Show.bs.tab: Mostrar el elemento actual
1.3. Hideen.bs.tab: completado ocultando el elemento anterior
1.4. Mostrado.bs.tab: Mostrar el elemento actual completo
1.5. Código fuente del evento Hiden/Show:
var $ anterior = $ ul.find ('. Active: Last a') var hideEvent = $ .event ('hide.bs.tab', {RelationTarget: $ this [0]}) var showEvent = $ .event ('show.bs.tab', {RelationTarget: $ anterior [0]})2. Activo: active el objeto actual
2.1. Agregue el atributo expandido de ARIA al elemento de navegación para marcar si este elemento está en el estado expandido
2.2. Usando el mecanismo de reflujo, use el atributo OffsetWidth para lograr el repintado parcial
La breve discusión anterior en la pestaña de análisis del código fuente de Bootstrap (TAB) es todo el contenido que comparto con usted. Espero que pueda darle una referencia y espero que pueda apoyar más a Wulin.com.