(function($) { $.fn.menumaker = function(options) { var cssmenu = $(this), settings = $.extend({ title: "", format: "dropdown", sticky: false }, options); return this.each(function() { cssmenu.prepend(''); $(this).find("#menu-button").on('click', function(){ $(this).toggleclass('menu-opened'); var mainmenu = $(this).next('ul'); if (mainmenu.hasclass('open')) { mainmenu.hide().removeclass('open'); } else { mainmenu.show().addclass('open'); if (settings.format === "dropdown") { mainmenu.find('ul').show(); } } }); cssmenu.find('li ul').parent().addclass('has-sub'); multitg = function() { cssmenu.find(".has-sub").prepend(''); cssmenu.find('.submenu-button').on('click', function() { $(this).toggleclass('submenu-opened'); if ($(this).siblings('ul').hasclass('open')) { $(this).siblings('ul').removeclass('open').hide(); } else { $(this).siblings('ul').addclass('open').show(); } }); }; if (settings.format === 'multitoggle') multitg(); else cssmenu.addclass('dropdown'); if (settings.sticky === true) cssmenu.css('position', 'fixed'); resizefix = function() { if ($( window ).width() > 1024) { cssmenu.find('ul').show(); } if ($(window).width() <= 1024) { cssmenu.find('ul').hide().removeclass('open'); } }; resizefix(); return $(window).on('resize', resizefix); }); }; })(jquery); (function($){ $(document).ready(function(){ $(document).ready(function() { $("#cssmenu").menumaker({ title: "", format: "multitoggle" }); $("#cssmenu").prepend(""); var foundactive = false, activeelement, lineposition = 0, menuline = $("#cssmenu #menu-line"), linewidth, defaultposition, defaultwidth; $("#cssmenu > ul > li").each(function() { if ($(this).hasclass('active')) { activeelement = $(this); foundactive = true; } }); if (foundactive === false) { activeelement = $("#cssmenu > ul > li").first(); } defaultwidth = linewidth = activeelement.width(); defaultposition = lineposition = activeelement.position().left; menuline.css("width", linewidth); menuline.css("left", lineposition); $("#cssmenu > ul > li").hover(function() { activeelement = $(this); linewidth = activeelement.width(); lineposition = activeelement.position().left; menuline.css("width", linewidth); menuline.css("left", lineposition); }, function() { menuline.css("left", defaultposition); menuline.css("width", defaultwidth); }); }); }); })(jquery);