JAVASCRIPT   40

mfn menu js

Guest on 29th June 2022 01:53:00 PM

  1. /*
  2. @Name:          Horizontal Multilevel Menu with WP MegaMenu Support
  3. @Author:    Muffin Group
  4. @Version:   2.0
  5. */
  6.  
  7. ;(function($){
  8.         $.fn.extend({
  9.                 muffingroup_menu: function(options) {
  10.                         var menu = $(this);
  11.                        
  12.                         var defaults = {
  13.                                 addLast         : false,
  14.                                 animation   : 'toggle',
  15.                                 arrows      : false,
  16.                                 delay       : 100,
  17.                                 hoverClass  : 'hover'
  18.                         };
  19.                         options = $.extend(defaults, options);
  20.                        
  21.                         // .submenu --------------------------
  22.                         menu.find("li:has(ul)")
  23.                                 .addClass("submenu")
  24.                                 .append("<span class='menu-toggle'>") // responsive menu toggle
  25.                         ;      
  26.                        
  27.                         // .mfn-megamenu-parent -------------
  28.                         menu.children("li:has(ul.mfn-megamenu)").addClass("mfn-megamenu-parent");      
  29.  
  30.                         // .last-item - submenu -------------
  31.                         $(".submenu ul li:last-child", menu).addClass("last-item");
  32.                        
  33.                         // options.addLast ------------------
  34.                         if(options.addLast) {
  35.                                 $("> li:last-child", menu)
  36.                                         .addClass("last")
  37.                                         .prev()
  38.                                                 .addClass("last");
  39.                         }
  40.                        
  41.                         // options.arrows -------------------
  42.                         if( options.arrows ) {
  43.                                 menu.find( "li ul li:has(ul) > a" ).append( "<span class='menu-arrow'><i class='fa fa-chevron-right'></i></span>" );
  44.                         }
  45.                        
  46.                         // .hover() -------------------------
  47.                         menu.find("> li, ul:not(.mfn-megamenu) li").hover(function() {
  48.                                 $(this).stop(true,true).addClass(options.hoverClass);
  49.                                 if (options.animation === "fade") {
  50.                                         $(this).children("ul").stop(true,true).fadeIn(options.delay);
  51.                                 } else if (options.animation === "toggle") {
  52.                                         $(this).children("ul").stop(true,true).slideDown(options.delay);
  53.                                 }
  54.                         }, function(){
  55.                                 $(this).stop(true,true).removeClass(options.hoverClass);
  56.                                 if (options.animation === "fade") {
  57.                                         $(this).children("ul").stop(true,true).fadeOut(options.delay);
  58.                                 } else if (options.animation === "toggle") {
  59.                                         $(this).children("ul").stop(true,true).slideUp(options.delay);
  60.                                 }
  61.                         });
  62.        
  63.                 }
  64.         });
  65. })(jQuery);

Raw Paste


Login or Register to edit or fork this paste. It's free.