Update jquery.jside.menu.js

Author: CodeHimBlog

js/jquery.jside.menu.js

@@ -1,5 +1,5 @@
-/*  Plugin: jSide Menu (Responsive Side Menu) 
- *   Frameworks: jQuery 3.3.1 & Material Design Iconic Font 2.0
+/*!  Plugin: jSide Menu (Responsive Side Menu) 
+ *   Dependency: jQuery 3.4.1 & Material Design Iconic Font 2.0
  *   Author: Asif Mughal
  *   GitHub: https://github.com/CodeHimBlog
  *   URL: https://www.codehim.com
@@ -13,26 +13,28 @@
    		   jSidePosition: "position-left", //possible options position-left or position-right 
            jSideSticky: true, // menubar will be fixed on top, false to set static
            jSideSkin: "default-skin", // to apply custom skin, just put its name in this string
-             
+           
+		   jSideTransition: 400, //Define the transition duration in milliseconds 
+  
   		   }, options);
 
   return this.each(function() {
-  var target, $headHeight,
-        $devHeight,
-        jSide,
-        arrow,
-        dimBackground;    
+  var jSide, target, headHeight, devHeight, arrow, dimBackground;   
+   
         target = $(this);
-
-/* Accessing DOM */
+		
+//Accessing DOM
   jSide = $(".menu-container, .menu-head");
-  $devHeight = $(window).height();
-  $headHeight = $(".menu-head").height();
-  arrow = document.createElement("i");
-  dimBackground = $(".dim-overlay");
+  devHeight = $(window).height();
+  headHeight = $(".menu-head").height();
+  dHeading = $(".dropdown-heading");
+  menuTrigger = $(".menu-trigger");
+  arrow = $("<i></i>");
+  dimBackground = $("<div>");
+  
 // Set the height of side menu according to the available height of device
 $(target).css({
-    'height' : $devHeight-$headHeight,
+    'height' : devHeight-headHeight,
 
 });
 
@@ -53,31 +55,19 @@ $(".menu-trigger").removeClass("left").addClass("right");
    }
 
 //Dropdown Arrow
-    $(arrow).addClass("zmdi zmdi-chevron-down arrow").appendTo(".dropdown-heading");
-
+    $(arrow).addClass("material-icons d-arrow").html("keyboard_arrow_down").appendTo(dHeading);
+//Dim Layer	
+    $(dimBackground).addClass("dim-overlay").appendTo("body");
 //Dropdowns
-    $(".dropdown-heading").click(function(){
-      var n = $(".has-sub").find("span:hover + ul li").length;
-      var h = $(".has-sub").find("span:hover + ul li").outerHeight();
-      var dropdown = h*n;
-      var todrop = $(".has-sub").find("span:hover + ul");
-      var nodrop = $(".has-sub ul");
-
-    $(todrop).animate({"height" : dropdown}, 100);
-    $(this).find("i").toggleClass("arrowdown");
-    if ($(todrop).height() == dropdown){
-      $(todrop).animate({"height" : 0}, 100);
-    }
-
-      if ($(nodrop).height(dropdown)){
-        $(nodrop).not(todrop).height(0); $(".dropdown-heading").not(this).find("i").removeClass("arrowdown");
-      }
+$(dHeading).click(function(){
+   $(this).parent().find("ul").slideToggle(setting.jSideTransition);
+   $(this).find(".d-arrow").toggleClass("d-down");
+    
  });
 
-$(".menu-trigger").click(function(){
+$(menuTrigger).click(function(){
    $(jSide).toggleClass("open");
-   $(dimBackground).show(500);
-
+   $(dimBackground).show(setting.jSideTransition);
 });
 
 //close menu if user click outside of it
@@ -89,7 +79,7 @@ $(".menu-trigger").click(function(){
 
  $(jSide).removeClass("open");
     if (!$(jSide).hasClass("open")) {
-     $(dimBackground).hide(500);
+     $(dimBackground).hide(setting.jSideTransition);
         }
       });
    });