Hover Menu Fix for Mobile Devices - disable menu hover on touch devices (Vanilla JS implementation)

README.md

I wanted a solution that was implemented in vanilla js and disabled hovers on the mobile devices. You will need to change the selector to match that of the target you have in mind.

disable-hover-on-mobile.js

function is_touch_device() {
  return !!('ontouchstart' in window);
}
document.addEventListener("DOMContentLoaded", function() {
  /* If mobile browser, prevent click on parent nav item from redirecting to URL */
	if(is_touch_device()) {	
 
        // replace the selector with the one that matches your menu item
        var selector = "a.gl-menu-link.dropdown-toggle";
        var menulinks = [].slice.call(document.querySelectorAll(selector));
        for (menulink of menulinks){
            
            menulink.addEventListener('click', function(event){
                event.preventDefault();
            });
         }

	}

});