li > a").on("cli...">

How to remove slideUp in jquery

I want to remove this function Slide up

$( document ).ready(function() { $("#tabBar ul.buttons > li > a").on("click", function(e){ //if submenu is hidden, does not have active class if(!$(this).hasClass("active")) { // hide any open menus and remove active classes $("#tabBar ul.buttons li ul").slideUp(350); $("#tabBar ul.buttons li a").removeClass("active"); // open submenu and add the active class $(this).next("ul").slideDown(350); $(this).addClass("active"); //if submenu is visible }else if($(this).hasClass("active")) { //hide submenu and remove active class $(this).removeClass("active"); $(this).next("ul").slideUp(350); } }); }); 

when I add another div to the jQuery body

 $(document).ready(function(){ $(".Collapse_menu").click(function(){ $(".bodyStatic").toggleClass("collapse-body"); //comment: here i want to add my code so that when i call collapse-body the top slide up function should remove }); }); 

I am creating a collapsible menu, here are the images to help you better understand

enter image description here enter image description here

+7
javascript jquery html html5
source share
2 answers

This is my attempt

 if($(".bodyStatic").hasClass("collapse-body")) { //DO NOTHING } else { $(this).next("ul").slideUp(350); } //OR VICE VERSA 
+1
source share

According to my understanding, when you click on .Collapse_menu , you want to collapse the horizontally extended menu and also close the vertically open submenu. If so, then you can try executing the code below:

Code1:

 $( document ).ready(function() { $("#tabBar ul.buttons > li > a").on("click", function(e){ if($(".bodyStatic").hasClass("collapse-body")) { $(".bodyStatic").removeClass("collapse-body") } //if submenu is hidden, does not have active class if(!$(this).hasClass("active")) { // hide any open menus and remove active classes $("#tabBar ul.buttons li ul").slideUp(350); $("#tabBar ul.buttons li a").removeClass("active"); // open submenu and add the active class $(this).next("ul").slideDown(350); $(this).addClass("active"); //if submenu is visible }else if($(this).hasClass("active")) { //hide submenu and remove active class $(this).removeClass("active"); $(this).next("ul").slideUp(350); } }); }); 

Code2:

 $(document).ready(function(){ $(".Collapse_menu").click(function(){ $(".bodyStatic").toggleClass("collapse-body"); var activeSubmenu = $("#tabBar ul.buttons > li > a.active"); //grab the active submenu if any //hide submenu and remove active class $(activeSubmenu).removeClass("active"); $(activeSubmenu).next("ul").slideUp(350); }); }); 

Please let me know the result.

+1
source share

All Articles