I am experiencing some issues with the active items in my menu and a submenu that toggles. When I click on "Prensa" or "Contacto," the script successfully adds the active class to the respective menu item. However, when I click on "Artworks," it not only adds the active class to the main link but also all the links within its submenu. Additionally, if I click back on "Prensa," the submenu from "Artworks" remains open and all the links associated with "Artworks" retain the active class (including the "Artworks" link itself).
Another challenge I face is that when I click on a submenu item, it only adds a class without any additional attributes, making it difficult for me to style it as active.
Below is the markup of my menu:
<ul id="menu" class="menu">
<li id="artworks"><a href="#">ARTWORK</a>
<ul class="submenu">
<img src="../img/submenu.png" alt="submenu" width="62" height="1" />
<li><a href="#" id="sweetlife">Sweet Life</a></li>
<li><a href="#">Pleasure</a></li>
<li><a href="#">Bienal de la habana</a></li>
<li><a href="#">Estudios de craneos</a></li>
</ul>
</li>
<li id="prensa_nav"><a href="#">PRENSA</a></li>
<li id="contacto_nav"><a href="#">CONTACTO</a></li>
</ul>
And here is the JavaScript code:
// Activate menu item
$(function() {
$('#menu li').click(function() {
$('#menu li').each(function() {
$(this).removeClass('active');
});
$(this).addClass('active');
});
});
/* Menu dropdown */
$(document).ready(function($){
// Add drop class if the item has a sub-menu
$('ul.submenu').closest('li').addClass('drop');
// Left Sidebar Main Navigation
var menu_ul = $('.menu > li.drop > ul'),
menu_a = $('.menu > li.drop > a');
menu_ul.hide();
menu_a.click(function(e) {
e.preventDefault();
if(!$(this).hasClass('active')) {
menu_a.removeClass('active');
menu_ul.filter(':visible').slideUp('normal');
$(this).addClass('active').next().stop(true,true).slideDown('normal');
} else {
$(this).removeClass('active');
$(this).next().stop(true,true).slideUp('normal');
}
});
});
If anyone could lend a hand in resolving these issues, it would be greatly appreciated!