Here is an example of 2 buttons that when pressed, slide out the main content revealing new content. This could be used for mobile navigation/search/quick links etc.
The HTML is like so:
<body> <div class="container"> <a href="#" class="leftBtn"><i class="fa fa-bars"></i></a> <a href="#" class="rightBtn"><i class="fa fa-user"></i></a> /* rest of main content </div> <div class="leftNav"> left content </div> <div class="rightNav"> right content </div> </body>
Then in the js, you’d call
slideOutBtn("leftBtn","leftNav");
slideOutBtn("rightBtn","rightNav","right");
You don’t need to add “left” at the end, as that is the default.
Leave a Reply