CODEWITHSUNDEEP
jqueryslidetoggle
Owen O'Neill
Owen O'Neill

Reputation: 227

jQuery showing at first instance instead of hide

I am using the below code for a menu to apear on a mobile css site.

At the moment it is appearing straight away when the site is loaded and I'd rather it load only on request when it is used... Any help? - I know it's a quick solution but cannot seem to work this out, i've tried other forums and searched online and yet to hear a response.

<script type="text/javascript">
jQuery(document).ready(function($){

    /* prepend menu icon */
    $('#nav-wrap').prepend('<div id="menu-icon"><img id="logo" src="<?php echo site_url(); ?>/wp-content/themes/blue-and-grey/images/mobileimages/hme_btn.png" /></div>');

    /* toggle nav */
    $("#menu-icon").on("click", function(){
        $("#nav").slideToggle();
        $(this).toggleClass("active");
    });

});
</script>

Upvotes: 0

Views: 175

Answers (2)

Kevin Bowersox
Kevin Bowersox

Reputation: 94479

You could add some simple css to hide the element

CSS

#menu-icon{
   display: none;
}

Upvotes: 2

Andrew Cheong
Andrew Cheong

Reputation: 30273

Just call hide() on whatever element it is that you want hidden, e.g. $("#nav").hide(), somewhere after the prepend.

Upvotes: 0

Related Questions