|
|
| Linha 100: |
Linha 100: |
|
| |
|
| /* Teste Menu */ | | /* Teste Menu */ |
| document.querySelectorAll('.tab-titles li').forEach(tab => {
| | .tab-button { |
| tab.addEventListener('click', function() {
| | padding: 10px; |
| // Remover a classe 'active' de todas as abas | | margin: 5px; |
| document.querySelectorAll('.tab-titles li').forEach(tabItem => { | | cursor: pointer; |
| tabItem.classList.remove('active');
| | border: 1px solid #ccc; |
| });
| | background-color: #f0f0f0; |
| | display: inline-block; |
| | } |
|
| |
|
| // Remover a classe 'active' de todos os conteúdos
| | .tab-button.active { |
| document.querySelectorAll('.tab-content').forEach(content => {
| | background-color: #d3d3d3; |
| content.classList.remove('active');
| | } |
| });
| |
|
| |
|
| // Adicionar a classe 'active' à aba selecionada
| | /* Estilos para as partes de conteúdo */ |
| this.classList.add('active'); | | .tab-content { |
| | display: none; |
| | } |
|
| |
|
| // Pegar o valor de 'data-tab' da aba clicada e exibir o conteúdo correspondente
| | .tab-content.active { |
| const tabId = this.getAttribute('data-tab');
| | display: block; |
| document.getElementById(tabId).classList.add('active'); | | } |
| }); | |
| });
| |