DropDown duplo ativando ao inicar o projeto (HTML e JavaScript)
Opa, tudo certo? Estou em uma situação bem chatinha já, vou exemplificar, possuo 2 DropDown, onde são ativados pelo clique, porem quando inicio o projeto, por padrão já esta vindo com os 2 DropDown ativados, como consigo ajeitar isso?
(Exemplo, estou fazendo assim) <li class="button-dropdown"> <a class="dropdown-toggle"> Exemplo 1 <span>▼</span> </a> <ul class="dropdown-menu"> <li> <a href=""> Sou o exemplo 1 </a> </li> </ul> </li> <li class="button-dropdown"> <a class="dropdown-toggle"> Exemplo 2 <span>▼</span> </a> <ul class="dropdown-menu"> <li> <a href=""> Sou o exemplo 2 </a> </li> </ul> </li> (Meu CSS) .nav { font-size: 16px; border: none; outline: none; padding: 14px 16px; font-family: inherit; margin: 0; border-radius: 10px; color: white; font-weight: bold; display: block; } .dropdown-toggle { font-size: 16px; border: none; outline: none; padding: 14px 16px; font-family: inherit; margin: 0; border-radius: 10px; color: white; font-weight: bold; position: all; cursor: pointer; } .dropdown-menu{ padding-left: 20px; } <script> jQuery(document).ready(function (e) { function t(t) { e(t).bind("click", function (t) { t.preventDefault(); e(this).parent().fadeOut() }) } e(".dropdown-toggle").click(function () { var t = e(this).parents(".button-dropdown").children(".dropdown-menu").is(":hidden"); e(".button-dropdown .dropdown-menu").hide(); e(".button-dropdown .dropdown-toggle").removeClass("active"); if (t) { e(this).parents(".button-dropdown").children(".dropdown-menu").toggle().parents(".button-dropdown").children(".dropdown-toggle").addClass("active") } }); e(document).bind("click", function (t) { var n = e(t.target); if (!n.parents().hasClass("button-dropdown")) e(".button-dropdown .dropdown-menu").hide(); }); e(document).bind("click", function (t) { var n = e(t.target); if (!n.parents().hasClass("button-dropdown")) e(".button-dropdown .dropdown-toggle").removeClass("active"); }) }); </script>
Ramboli
Curtidas 0