Toggle Hide/Show sidebar jQuery not working -


i can't figure out why toggle isn't working in code. should hide sidebar when click on navbutton, doesn't. thank reading question.

javascript

$('#navbutton').click(function() { $('#sidebar').toggle('slow'); }); 

html/php (look between < button > < /button> tag.

                <div id="header">                  <button type="button" class="btn btn-default btn-lg"id="navbutton">                 <span class="glyphicon glyphicon-align-justify"></span>                 </button>                  <div id="title">                 <a href="home.php" style="color:#fafafa;text-decoration:none;">trigger</div>                 <div id="menuinheader"><ul><li><a href="logout.php"><i class="fa fa-external-link fa-fw"></i> logout</a></li></ul></div>             </div> 

css

#sidebar { position:absolute; left:0; width:200px; height:100%; background:#5e5e5e; opacity:0.9; } 

add div mark up

<div id="sidebar"></div> 

and wrap js in document.ready

try this

$(document).ready(function(){    $('#navbutton').click(function(e) {     e.preventdefault();          $('#sidebar').toggle('slow');    });  }); 

demo here


Comments

Popular posts from this blog

windows - Single EXE to Install Python Standalone Executable for Easy Distribution -

c# - Access objects in UserControl from MainWindow in WPF -

javascript - How to name a jQuery function to make a browser's back button work? -