1// Item Name : Responsive Mega Menu Complete Set 2// Item URI : http://codecanyon.net/item/mega-menu-complete-set/152825 3// Author URI : http://codecanyon.net/user/Pixelworkshop/ 4// Version : 3.32 5 6 7 8(function ($) { 9 10 var settings = { 11 menu_speed_show:300, // Time (in milliseconds) to show a drop down 12 menu_speed_hide:200, // Time (in milliseconds) to hide a drop down 13 menu_speed_delay:200, // Time (in milliseconds) before showing a drop down 14 menu_effect:'hover_fade', // Drop down effect, choose between 'hover_fade', 'hover_slide', 'click_fade', 'click_slide', 'open_close_fade', 'open_close_slide' 15 menu_click_outside:0, // Clicks outside the drop down close it (1 = true, 0 = false) 16 menu_show_onload:0, // Drop down to show on page load (type the number of the drop down, 0 for none) 17 menu_responsive:1 // 1 = Responsive, 0 = Not responsive 18 }; 19 20 var methods = { 21 22 init:function (options) { 23 24 25 settings = $.extend(1, settings, options); 26 27 28 hoverIntentConfig = { // HoverIntent Configuration 29 sensitivity:2, // number = sensitivity threshold (must be 1 or higher) 30 interval:settings.menu_speed_delay, // number = milliseconds for onMouseOver polling interval 31 over:megaMenuOver, // function = onMouseOver callback (REQUIRED) 32 timeout:200, // number = milliseconds delay before onMouseOut 33 out:megaMenuOut // function = onMouseOut callback (REQUIRED) 34 } 35 36 37 return this.each(function () { 38 39 40 var megaMenu = $(this), 41 menuItem = $(megaMenu).children('li'), 42 menuItemLink = $(menuItem).children('.megamenu_drop'), 43 menuDropDown = $(menuItem).find('.dropdown_container, .dropdown_fullwidth'), 44 menuItemFlyOut = $(menuItem).find('.dropdown_parent'), 45 menuItemFlyOutLink = $(menuItemFlyOut).children('a'), 46 menuItemFlyOutDropDown = $(menuItemFlyOut).find('.dropdown_flyout_level'), 47 menuButton = $('.megamenu_button'); 48 49 menuItemElement = $(menuItem).add(menuItemFlyOut); 50 menuDropDownElement = $(menuDropDown).add(menuItemFlyOutDropDown); 51 52 53 if (("ontouchstart" in document.documentElement) && (settings.menu_responsive === 1)) { 54 55 56 if ($(document).width() < 768) { 57 $(menuDropDown).css({'left':'-1px', 'top':'auto'}).hide(); 58 $(menuItemFlyOutDropDown).css({'left':'0', 'top':'0'}).hide(); 59 $(menuItem).hide(0); 60 $(menuButton).show(0); 61 62 } else { 63 megaMenuDropDownPosition(); 64 } 65 66 $(menuButton).children('a').hammer().on('tap', function () { 67 $(menuButton).toggleClass('megamenu_button_active'); 68 $(menuItem).not(":eq(0)").toggle(0); 69 }); 70 71 $(menuItemElement).toggleClass('noactive'); 72 73 // Event attached to the link instead of the LI element 74 // to prevent the drop down from being closed if a touch 75 // event occurs within its area. 76 77 $(menuItemLink).hammer().on('tap', function () { 78 var $this = $(this); 79 $this.parent(menuItem).toggleClass('active noactive') 80 .find(menuDropDown).toggle(0); 81 // No chaining here, the horizontal and vertical 82 // versions don't use the exact same structure. 83 $this.parent(menuItem).siblings().addClass('noactive').removeClass('active') 84 .find(menuDropDown).hide(0); 85 return false; 86 }); 87 88 $(menuItemFlyOutLink).hammer().on('tap', function () { 89 var $this = $(this); 90 $this.parent(menuItemFlyOut) 91 .toggleClass('active noactive') 92 .find(menuItemFlyOutDropDown).first() 93 .toggle(0); 94 $this.parent(menuItemFlyOut).siblings().addClass('noactive').removeClass('active') 95 .find(menuItemFlyOutDropDown).hide(0); 96 $this.parent(menuItemFlyOut).siblings() 97 .find(menuItemFlyOut).addClass('noactive').removeClass('active'); 98 return false; 99 }); 100 101 $(document).hammer().on('tap', function () { 102 $(menuItemElement).addClass('noactive'); 103 $(menuDropDownElement).hide(0); 104 }); 105 $(megaMenu).hammer().on('tap', function (event) { 106 event.stopPropagation(); 107 }); 108 $(window).bind('orientationchange', function () { 109 $(menuItemElement).addClass('noactive'); 110 $(menuDropDownElement).hide(0); 111 }); 112 113 return; 114 115 116 } else { 117 118 119 megaMenuDropDownPosition(); 120 121 $(window).resize(function() { 122 $(menuButton).removeClass('megamenu_button_active'); 123 megaMenuDropDownPosition(); 124 }); 125 126 $(menuButton).children('a').click(function () { 127 $(menuButton).toggleClass('megamenu_button_active'); 128 $(menuItem).not(":eq(0)").toggle(0); 129 }); 130 131 if (settings.menu_click_outside === 1) { 132 133 $(document).click(function () { 134 $(menuItemElement).removeClass('active'); 135 $(menuDropDownElement).hide(0); 136 }); 137 $(megaMenu).click(function (event) { 138 event.stopPropagation(); 139 }); 140 } 141 142 switch (settings.menu_effect) { 143 144 case 'open_close_fade': 145 var menuEffectShow = 'fadeToggle', 146 menuEffectHide = 'fadeOut'; 147 break; 148 case 'open_close_slide': 149 var menuEffectShow = 'slideToggle', 150 menuEffectHide = 'slideUp'; 151 break; 152 case 'open_close_toggle': 153 var menuEffectShow = 'toggle', 154 menuEffectHide = 'hide'; 155 break; 156 157 } 158 159 switch (settings.menu_effect) { 160 161 case 'hover_fade': 162 case 'hover_slide': 163 case 'hover_toggle': 164 case 'click_fade': 165 case 'click_slide': 166 case 'click_toggle': 167 $(menuItem).hoverIntent(hoverIntentConfig); 168 $(menuItemFlyOut).hoverIntent(hoverIntentConfig); 169 break; 170 171 case 'open_close_fade': 172 case 'open_close_slide': 173 case 'open_close_toggle': 174 175 $('.megamenu > li:nth-child(' + settings.menu_show_onload + ')') 176 .find(menuDropDown).show() 177 .closest(menuItem).toggleClass('active'); 178 179 $(menuItem).unbind('mouseenter mouseleave').click(function () { 180 181 var $this = $(this); 182 $this.siblings().removeClass('active') 183 .find(menuDropDown)[menuEffectHide](settings.menu_speed_hide); 184 $this.toggleClass('active') 185 .find(menuDropDown).first() 186 .delay(settings.menu_speed_delay)[menuEffectShow](settings.menu_speed_show) 187 .click(function (event) { 188 event.stopPropagation(); 189 }); 190 191 }); 192 193 $(menuItemFlyOut).unbind('mouseenter mouseleave').click(function () { 194 195 var $this = $(this); 196 $this.siblings().removeClass('active') 197 .find(menuItemFlyOutDropDown)[menuEffectHide](settings.menu_speed_hide); 198 $this.siblings().find('li').removeClass('active'); 199 $this.toggleClass('active') 200 .find(menuItemFlyOutDropDown).first() 201 .delay(settings.menu_speed_delay)[menuEffectShow](settings.menu_speed_show) 202 .click(function (event) { 203 event.stopPropagation(); 204 }); 205 206 }); 207 208 break; 209 210 211 } 212 213 214 } 215 216 217 }); // End each 218 219 }, 220 221 update:function (options) { 222 settings = $.extend(1, settings, options); 223 } 224 }; 225 226 227 $.fn.megaMenuCompleteSet = function (method) { 228 229 if (methods[method]) { 230 return methods[method].apply(this, Array.prototype.slice.call(arguments, 1)); 231 } else if (typeof method === 'object' || !method) { 232 return methods.init.apply(this, arguments); 233 } else { 234 $.error('No found method ' + method); 235 } 236 237 }; 238 239 240 function megaMenuOver() { 241 242 var $this = $(this), 243 dropDownMega = $('.dropdown_container, .dropdown_fullwidth', $this), 244 dropDownFlyOutLevel = $this.children('.dropdown_flyout_level'); 245 246 dropDownMega = $(dropDownMega).add(dropDownFlyOutLevel); 247 248 switch (settings.menu_effect) { 249 case 'hover_fade': 250 $(dropDownMega).fadeIn(settings.menu_speed_show); 251 break; 252 case 'hover_slide': 253 $(dropDownMega).slideDown(settings.menu_speed_show); 254 break; 255 case 'hover_toggle': 256 $(dropDownMega).show(settings.menu_speed_show); 257 break; 258 case 'click_fade': 259 $this.click(function () { 260 $(dropDownMega).fadeIn(settings.menu_speed_show); 261 }); 262 break; 263 case 'click_slide': 264 $this.click(function () { 265 $(dropDownMega).slideDown(settings.menu_speed_show); 266 }); 267 break; 268 case 'click_toggle': 269 $this.click(function () { 270 $(dropDownMega).show(settings.menu_speed_show); 271 }); 272 break; 273 274 } 275 276 } 277 278 279 function megaMenuOut() { 280 281 var $this = $(this), 282 dropDownMega = $('.dropdown_container, .dropdown_fullwidth, .dropdown_flyout_level', $this); 283 284 switch (settings.menu_effect) { 285 case 'hover_fade': 286 case 'click_fade': 287 $(dropDownMega).fadeOut(settings.menu_speed_hide); 288 break; 289 case 'hover_slide': 290 case 'click_slide': 291 $(dropDownMega).slideUp(settings.menu_speed_hide); 292 break; 293 case 'hover_toggle': 294 case 'click_toggle': 295 $(dropDownMega).toggle(settings.menu_speed_hide); 296 break; 297 298 } 299 300 } 301 302 303 function megaMenuDropDownPosition() { 304 305 // This part uses CSS so the drop downs remain opened when using the effects 306 // 'open_close_fade', 'open_close_slide' and 'open_close_fade'.
307 // Without those top and left values, the drop downs would be hidden 308 // when not hovered. 309 310 if (($(document).width() < 768) && (settings.menu_responsive === 1)) { 311 $('.dropdown_container, .dropdown_fullwidth').css({'left':'-1px', 'top':'auto'}).hide(); 312 $('.dropdown_first').css({'left':'0'}).hide(); 313 $('.dropdown_flyout_level, .dropdown_flyout_level_left').css({'left':'0', 'top':'0'}).hide(); 314 $('.megamenu').children('li').hide(0); 315 $('.megamenu_button').show(0); 316 } 317 318 else { 319 320 $('.dropdown_container').css({'left':'auto', 'top':'auto'}).hide(); 321 $('.dropdown_fullwidth').css({'left':'-1px', 'top':'auto'}).hide(); 322 $('.dropdown_flyout_level').css({'left':'95%', 'top':'-21px'}).hide(); 323 $('.dropdown_flyout_level_left').css({'left':'-108%', 'right':'100%'}).hide(); 324 $('.megamenu').children('li').show(0); 325 $('.megamenu_button').hide(0); 326 327 } 328 329 $('.megamenu_container_vertical').find('.dropdown_container, .dropdown_fullwidth').css({'top':'0'}); 330 331 } 332 333 334})(jQuery);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.