Yes, there is a way by using some CSS and JavaScript(not aware of about any plugins).
Can you provide a link to your side so that i can provide you the exact code?
Here’s the general idea on what i am talking about:
Consider you have a sidebar on a page with has the following HTML and CSS:
HTML:
<div class="main-content">
<a href="#" class="hider-btn">TOGGLE SIDEBAR</a>
MAIN CONTENT TEXT...
...some more text...
</div>
<div class="sidebar">
SOME SIDEBAR CONTENT
...some more content...
</div>
CSS:
.main-content {
display: inline-block;
height: 100vh;
background: #cccccc;
color: #2e2e2e;
width: 50%;
}
.sidebar {
float: right;
height: 100vh;
background: #2e2e2e;
color: #ffffff;
width: 50%;
}
Then you can just hide the sidebar by just creating a new CSS class, like this:
.sidebar-hider {
display: none !important;
}
And then, toggle this class using JavaScript(jQuery required) to show and hide the sidebar by detecting the onclick
event of hider-btn
class, like this:
$('.hider-btn').click(function(){
$('.sidebar').toggleClass('sidebar-hider');
});
Here’s a working JSFiddle demo:
https://jsfiddle.net/5mcLvywy/
Let me know if this helps ??
-
This reply was modified 7 years, 7 months ago by otpidusprime.