1. Análise de navegação (NAV)
Arquivo de código -fonte:
_navs.scss: módulo de navegação
Mixins/_nav-divider.scss: linha de divisor
Mixins/_nav-vertical-align.scss: alinhamento vertical
1. É apenas estilizado com CSS e não depende do JS.
2. O módulo de navegação pode incluir um módulo de retirada
3. Realize distribuição igual horizontal, vertical e horizontal (implementação de células de mesa, remoção 4.0), guias, cápsulas e outros estilos
4. Nav-Divider: há uma altura de pixel para realizar a linha de divisor
5.
6. Fornece a classe de conteúdo da guia para envolver as guias e, em seguida
7. O menu suspenso sob as abas NAV foi processado para encolher um pixel para cima, porque as abas de navegação terão uma linha de fundo e não encolhem um pixel para cima, e haverá lacunas em branco.
// suspensos específicos // Remova os cantos arredondados top aqui, pois há uma aresta dura acima do menu @include Border-top-Radius (0);}
2. Efeito de colapso
Arquivo de código -fonte:
Mixins/_Component-Animations.SCSS: colapso implementação para obter efeito de dobragem
Javascripts/bootstrap/colapso.js: implementação do efeito de colapso
1. $ This.data () coleta todos os dados-* dados
2. Propriedade dos pais: especifica que o colapso da corrente é controlado pelo pai, que percebe principalmente o efeito de um controle e muitos. A seguir, é apresentado o código de ocultar todas as listas de crianças sob o mesmo pai:
retornar $ (this.options.parent) .find ('[data-toggle = "colapso"] [data-parent = "' + this.options.parent + '"]') .ECH ($.3. A implementação do Praent também requer a integração da classe .Panel, porque, ao pesquisar, acredita -se que todos os sublistas sejam colocados sob a classe .Panel.
4. Método JQuery's End (): encerre a corrente de filtro atual e restaure o elemento de correspondência definido para seu estado anterior (a posição em que a corrente começa)
$ ("P"). Find ('.
5. ScrolHeight: A altura da página (obtenha a altura/largura real a ser expandida), contém a parte invisível da janela, que é usada no colapso para identificar o valor máximo a ser expandido e a altura/widht será limpa após a conclusão do movimento.
var scrollSize = $ .camelCase (['roll', dimensão] .Join ('-')) isto.6. Os elementos de processamento são divididos em duas categorias: um é expandir ou ocultar o próprio elemento ($ elemento), e o outro é tocar no botão para desenvolver ou ocultar o elemento ($ trigger)
7. No método Hiden, a altura da área dobrada será redesenhada e, em seguida, a altura da área real será obtida:
this. $ elemento [dimensão] (this
8. O gatilho do método Hiden é acionado por padrão através do julgamento no método Show:
if (Actives && Actives.length) {plugin.call (Actives, 'hide') ActiveSData || actives.data ('bs.collapse', null)}O exposto acima é tudo sobre este artigo, espero que seja útil para todos aprenderem a programação de JavaScript.