Make menu dropdowns work on touch devices with JAVA using double tap method

So I want to make my menu dropdowns work on touch devices too with double touch. The first touch is opening submenu (if submenu exists) and the second touch on the same menu item goes to URL. I found some javascript code that does that. The only problem is that it only works when I am on top of the current page. If I scroll a bit and press a menu item, it doesn't open the submenu anymore and it goes directly to the link. So it just works on top of the page. Any idea why that happening would be appreciated... $(document).ready(function(){ //added for surface window.USER_IS_TOUCHING = false; [login to view URL]('touchstart', function onFirstTouch() { window.USER_IS_TOUCHING = true; // we only need to know once that a human touched the screen, so we can stop listening now [login to view URL]('touchstart', onFirstTouch, false); }, false); function is_touch_device() { return 'ontouchstart' in window // works on most browsers || [login to view URL]; // works on IE10/11 and Surface }; $('ul > li > a').click(function(e){ var target = $([login to view URL]); var parent = [login to view URL](); // the li if(is_touch_device() || window.USER_IS_TOUCHING){ if([login to view URL]("active")){ //run default action of the link } else{ [login to view URL](); //remove class active from all links $('ul > li > [login to view URL]').removeClass('active'); //set class active to current link [login to view URL]("active"); [login to view URL]("active"); } } }); $('ul > li').click(function(e){ //remove class active from all links if li was clicked if ([login to view URL] == this){ $(".active").removeClass('active'); } }); });