I've been struggling with this issue for quite some time now and I just can't seem to make it work. The JavaScript I'm working on involves using addClass and removeClass to display and hide a submenu element. While the addclass and removeClass functions are functioning properly, I'm having trouble getting fadeIn and fadeOut to work as intended. I have experimented with the animate function, but so far, it hasn't provided a solution. Someone suggested trying out toggleClass, which I plan to investigate further at a later time.
jQuery(document).ready(function (e) {
function t(t) {
e(t).bind("click", function (t) {
t.preventDefault();
e(this).parent();
});
}
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"); //i believe that this is where i need to toggle the fadeIn and FadeOut
}
});
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");
}
})
});
The HTML snippet related to this issue:
<nav class="nav2">
<a href="profile.php" class="imglink"><img src="img/icon-profile.png" WIDTH=40 HEIGHT=40></a>
<li class="button-dropdown">
<a href="javascript:void(0)" class="dropdown-toggle"><img src="img/cart.png" class="cart"WIDTH=40 HEIGHT=40></a>
<ul class="dropdown-menu" style="list-style:none;">
<p>
<h2 class="profileH2">Winkelwagen</h2>
</p>
</ul>
</li>
</nav>This piece of code controls the visibility of the submenu within the button-dropdown. Any assistance in resolving this issue would be greatly appreciated.
Thank you
Note: The JavaScript code referenced was discovered on CodePen through a random Google search. If you are the original author, please let me know so I can give proper credit. Thank you.