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

Widget:Test (ver código-fonte)

Edição das 00h55min de 27 de dezembro de 2024

338 bytes adicionados , 27 de dezembro de 2024

sem sumário de edição

Renee

Administradores

6 392

edições

@@ Linha 63: / Linha 63: @@
 document.addEventListener('keydown', function (event) {
-    // Verifica se o dropdown está visível
      if (dropdown.style.display === 'none' || !dropdown.childNodes.length) {
          return; // Sai da função se o dropdown estiver escondido ou vazio
@@ Linha 72: / Linha 71: @@
      if (event.key === 'ArrowDown') {
-        // Remove a classe 'active' de todos os itens antes de navegar
+         allItems.forEach(item => item.classList.remove('active')); // Remove 'active'
-         allItems.forEach(item => item.classList.remove('active'));
          if (activeItem) {
-             const nextItem = activeItem.nextElementSibling || allItems[0]; // Próximo item ou o primeiro
+             const nextItem = activeItem.nextElementSibling || allItems[0];
              nextItem.classList.add('active');
              nextItem.scrollIntoView({ block: "nearest" });
          } else {
-             allItems[0].classList.add('active'); // Ativa o primeiro item
+             allItems[0].classList.add('active');
              allItems[0].scrollIntoView({ block: "nearest" });
          }
-         event.preventDefault(); // Evita comportamento padrão
+         event.preventDefault();
      } else if (event.key === 'ArrowUp') {
-        // Remove a classe 'active' de todos os itens antes de navegar
+         allItems.forEach(item => item.classList.remove('active')); // Remove 'active'
-         allItems.forEach(item => item.classList.remove('active'));
          if (activeItem) {
-             const previousItem = activeItem.previousElementSibling || allItems[allItems.length - 1]; // Item anterior ou o último
+             const previousItem = activeItem.previousElementSibling || allItems[allItems.length - 1];
              previousItem.classList.add('active');
              previousItem.scrollIntoView({ block: "nearest" });
          } else {
-             allItems[allItems.length - 1].classList.add('active'); // Ativa o último item
+             allItems[allItems.length - 1].classList.add('active');
              allItems[allItems.length - 1].scrollIntoView({ block: "nearest" });
          }
@@ Linha 99: / Linha 96: @@
      } else if (event.key === 'Enter') {
          if (activeItem) {
-             activeItem.click(); // Simula o clique no item ativo
+             activeItem.click();
          }
          event.preventDefault();
@@ Linha 105: / Linha 102: @@
 });
+// Adicionar eventos ao passar o mouse
+dropdown.addEventListener('mouseover', function (event) {
+    if (event.target.classList.contains('dropdown-item')) {
+        const allItems = dropdown.querySelectorAll('.dropdown-item');
+        allItems.forEach(item => item.classList.remove('active')); // Remove 'active'
+        event.target.classList.add('active'); // Adiciona 'active' ao item do mouse
+    }
+});
+// Adicionar evento ao tirar o mouse do dropdown
+dropdown.addEventListener('mouseout', function () {
+    const allItems = dropdown.querySelectorAll('.dropdown-item');
+    allItems.forEach(item => item.classList.remove('active')); // Remove 'active'
+});