mircobabini
5/6/2015 - 8:18 AM

Wordpress LMS theme - Enhance menu & support hover effect on mobile tap

Wordpress LMS theme - Enhance menu & support hover effect on mobile tap

/* inside framework / custom.js comment / add these lines */

// if( isMobile || currentWidth < 767 ){
// 	$('ul.sub-menu').each( function() {
// 		if(!$(this).parents().hasClass('megamenu-child-container')) {
// 			$(this).slideUp(400).slideDown(400).slideUp(400);
// 		}
// 	});
// }

var hasTouch = ("ontouchstart" in window);
if (hasTouch) {
var i, len, element,
    dropdowns = document.querySelectorAll("#main-menu .menu-item-has-children > a");

	function menuTouch(event) {
	    // toggle flag for preventing click for this link
	    var i, len, noclick = !(this.dataNoclick);
	
	    // reset flag on all links
	    for (i = 0, len = dropdowns.length; i < len; ++i) {
	        dropdowns[i].dataNoclick = false;
	    }
	
	    // set new flag value and focus on dropdown menu
	    this.dataNoclick = noclick;
	    this.focus();
	    // jQuery(this).find('.sub-menu:first').fadeIn();
	}
	
	function menuClick(event) {
	    // if click isn't wanted, prevent it
	    if (this.dataNoclick) {
	        event.preventDefault();
	    }
	}
	
	for (i = 0, len = dropdowns.length; i < len; ++i) {
	    element = dropdowns[i];
	    element.dataNoclick = false;
	    element.addEventListener("touchstart", menuTouch, false);
	    element.addEventListener("click", menuClick, false);
	}
}