Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
A Pen by Arron Mabrey.
<div id="menu-icon">#menu-icon (click me)</div>
<div id="mobile-menu">
<ul>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-16">
<a href="http://goldenshine.harbrdev.com/about-us/">About Us</a>
</li>
<li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-79">
<a href="#">Services</a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-post_type menu-item-object-service-locations menu-item-195">
<a href="http://goldenshine.harbrdev.com/service-locations/san-diego/carpet-cleaning/">Carpet Cleaning</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-service-locations menu-item-200">
<a href="http://goldenshine.harbrdev.com/service-locations/san-diego/window-cleaning/">Window Cleaning</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-service-locations menu-item-198">
<a href="http://goldenshine.harbrdev.com/service-locations/san-diego/green-cleaning/">Green Cleaning</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-service-locations menu-item-197">
<a href="http://goldenshine.harbrdev.com/service-locations/san-diego/deep-cleaning/">Deep Cleaning</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-service-locations menu-item-199">
<a href="http://goldenshine.harbrdev.com/service-locations/san-diego/vacancy-cleaning/">Vacancy Cleaning</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-service-locations menu-item-196">
<a href="http://goldenshine.harbrdev.com/service-locations/san-diego/christmas-lights/">Christmas Lights</a>
</li>
</ul>
</li>
<li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-142">
<a href="#">Cities</a>
<ul class="sub-menu">
<li class="menu-item menu-item-type-post_type menu-item-object-service-locations menu-item-148">
<a href="http://goldenshine.harbrdev.com/service-locations/san-diego/">San Diego, CA</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-service-locations menu-item-144">
<a href="http://goldenshine.harbrdev.com/service-locations/orange-county/">Orange County, CA</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-service-locations menu-item-235">
<a href="http://goldenshine.harbrdev.com/service-locations/los-angeles/">Los Angeles, CA</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-service-locations menu-item-146">
<a href="http://goldenshine.harbrdev.com/service-locations/portland/">Portland, OR</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-service-locations menu-item-145">
<a href="http://goldenshine.harbrdev.com/service-locations/phoenix/">Phoenix, AZ</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-service-locations menu-item-143">
<a href="http://goldenshine.harbrdev.com/service-locations/las-vegas/">Las Vegas, NV</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-service-locations menu-item-237">
<a href="http://goldenshine.harbrdev.com/service-locations/salt-lake-city/">Salt Lake City, UT</a>
</li>
</ul>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-103">
<a href="http://goldenshine.harbrdev.com/blog/">Blog</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-210">
<a href="http://goldenshine.harbrdev.com/contact-us/">Contact</a>
</li>
</ul>
</div>
$(function() {
// Mobile Menu toggle
/* toggle nav */
$("#menu-icon").on("click", function(){
$("#mobile-menu").slideToggle('fast', 'swing');
$(this).toggleClass("active");
});
$("#mobile-menu li.menu-item-has-children > a").on("click", function(){
var $el = $(this).parent();
event.preventDefault();
$el.find(".sub-menu").slideToggle('fast', 'swing');
$el.toggleClass("active");
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.