YaSh Chaudhary YaSh Chaudhary - 1 month ago 7
HTML Question

slide out navigation loading automatically?

I have slide out navigation on my page which is loaded automatically i.e. on the page load.I want that it should only open when user clicks on the menu bar(in my case it's hamburger sign).

Html code:

<i class="fa fa-bars toggle_menu"></i>
<div class="sidebar_menu">
<i class="fa fa-times"></i>


js code:

$(document).ready(function() {
$(".fa-times").click(function() {
$(".sidebar_menu").addClass("hide_menu");
$(".toggle_menu").addClass("opacity_one");
});
$(".toggle_menu").click(function() {
$(".sidebar_menu").removeClass("hide_menu");
$(".toggle_menu").removeClass("opacity_one");
});
});

Answer

I believe you need to add class hide_menu in your HTML itself so that the sidebar_menu will be hidden at the time of page load. So modify HTML like:

<i class="fa fa-bars toggle_menu"></i>
<div class="sidebar_menu hide_menu">
<i class="fa fa-times"></i>
Comments