Jquery animated submenu on Android

I recently did some research into animating the submenu in a wordpress twentythirteen child theme, and finally figured out how to make it work (jquery newb). The animated submenu dropdown works wonderfully on a computer, however I noticed that on my android phone, it requires a double tap on the submenu to make the animation trigger. I was hoping others can spot the mistake in my code and/or provide additional code to accommodate. The Site: https://www.alphagraphicsbillings.com (you have to click one of the homepage links to get to the subpages which have the twentythirteen menu).

The Code:
– in my child theme functions.php:

<?php

function animatemenu_enqueue_script() {
	wp_enqueue_script( 'animate-menu', '/wp-content/themes/twentythirteen-child/js/animate-submenu.js', false );
}

add_action( 'wp_enqueue_scripts', 'animatemenu_enqueue_script' );

?>

The animate-submenu.js script:

jQuery(document).ready(function() {
    jQuery(".sub-menu").hide(); // hide the submenu on page load
    jQuery(".current_page_item .sub-menu").show();
    jQuery("ul#menu-nav-menu li").hover(function() {
        jQuery(this).find('ul.sub-menu')
            .stop(true, true).delay(20).animate({ "height": "show", "opacity": "show" }, 500 );
    }, function(){
        jQuery(this).find('ul.sub-menu')
            .stop(true, true).delay(20).animate({ "height": "hide", "opacity": "hide" }, 500 );
    });

});

Is this a code problem? Or a jquery enqueue or version problem? I assume that jquery is loaded via another plugin, because I haven’t added the enqueue function to anything on the child theme (which may or may not be part of the problem).

In answer to using a plugin instead of manually doing it, I always prefer – if I can – to create boilerplate snippets of code to handle things like this rather than creating plugin bloat/potential plugin update issues.

Appreciate the help and education!