Widget:Test: mudanças entre as edições

Ir para navegação Ir para pesquisar
55 bytes adicionados ,  27 de dezembro de 2024
sem sumário de edição
Sem resumo de edição
Sem resumo de edição
Linha 68: Linha 68:
     }
     }


    // Remove a seleção atual antes de navegar
     const allItems = dropdown.querySelectorAll('.dropdown-item');
     const allItems = dropdown.querySelectorAll('.dropdown-item');
     allItems.forEach(item => item.classList.remove('active'));
     let activeItem = document.querySelector('.dropdown-item.active');


     const activeItem = document.querySelector('.dropdown-item.active');
     if (event.key === 'ArrowDown') {
        // Remove a classe 'active' de todos os itens antes de navegar
        allItems.forEach(item => item.classList.remove('active'));


    if (event.key === 'ArrowDown') {
         if (activeItem) {
         if (activeItem) {
             const nextItem = activeItem.nextElementSibling || dropdown.firstChild; // Vai para o próximo ou volta para o início
             const nextItem = activeItem.nextElementSibling || allItems[0]; // Próximo item ou o primeiro
             nextItem.classList.add('active');
             nextItem.classList.add('active');
             nextItem.scrollIntoView({ block: "nearest" }); // Garante que o item fique visível
             nextItem.scrollIntoView({ block: "nearest" });
         } else {
         } else {
             dropdown.firstChild.classList.add('active'); // Ativa o primeiro item se nenhum estiver ativo
             allItems[0].classList.add('active'); // Ativa o primeiro item
             dropdown.firstChild.scrollIntoView({ block: "nearest" });
             allItems[0].scrollIntoView({ block: "nearest" });
         }
         }
         event.preventDefault(); // Evita comportamento padrão
         event.preventDefault(); // Evita comportamento padrão
     } else if (event.key === 'ArrowUp') {
     } else if (event.key === 'ArrowUp') {
        // Remove a classe 'active' de todos os itens antes de navegar
        allItems.forEach(item => item.classList.remove('active'));
         if (activeItem) {
         if (activeItem) {
             const previousItem = activeItem.previousElementSibling || dropdown.lastChild; // Vai para o anterior ou volta para o final
             const previousItem = activeItem.previousElementSibling || allItems[allItems.length - 1]; // Item anterior ou o último
             previousItem.classList.add('active');
             previousItem.classList.add('active');
             previousItem.scrollIntoView({ block: "nearest" });
             previousItem.scrollIntoView({ block: "nearest" });
         } else {
         } else {
             dropdown.lastChild.classList.add('active'); // Ativa o último item se nenhum estiver ativo
             allItems[allItems.length - 1].classList.add('active'); // Ativa o último item
             dropdown.lastChild.scrollIntoView({ block: "nearest" });
             allItems[allItems.length - 1].scrollIntoView({ block: "nearest" });
         }
         }
         event.preventDefault();
         event.preventDefault();
     } else if (event.key === 'Enter') {
     } else if (event.key === 'Enter') {
         if (activeItem) {
         if (activeItem) {
             activeItem.click(); // Simula um clique no item ativo
             activeItem.click(); // Simula o clique no item ativo
         }
         }
         event.preventDefault();
         event.preventDefault();
6 386

edições

Menu de navegação