disable/hide sidebar at onload #442
Comments
|
I think |
|
hi, this will not work on mobile browser |
|
Interesting, how does closing the sidebar work on mobile? |
|
The problem here is that the On a mobile screen the This seems to be some hack to transition a responsive desktop site which has a sidebar to a mobile width and auto-closing the sidebar. However, this transition does not happen by using the EDIT: The solution is to add the following styles, which makes consistent /* Fix `close` style on mobile */
@media screen and (max-width: 768px) {
/* Fix behavior for when sidebar should be open */
body .sidebar {
transform: translateX(300px);
}
body .content {
transform: translateX(300px);
}
.sidebar-toggle {
background-color: rgba(255,255,255,0.8);
transition: 1s background-color;
width: 284px;
padding: 10px;
}
/* Fix behavior for when sidebar should be closed */
body.close .sidebar {
transform: translateX(0);
}
body.close .content {
transform: translateX(0px);
}
body.close .sidebar-toggle {
background-color: transparent;
width: auto;
padding: 30px 30px 10px 10px;
}
}Note that this does have a strange behavior when actively changing the resolution of your screen, you will see a CSS transition. If someone knows how to fix this, without disabling the transition altogether, let me know. |
Is there an option to hide or disable sidebar at onload event? I'm currently relying on custom
$('.sidebar-toggle-button').click()to hide it, but wondering if there is native support or options.The text was updated successfully, but these errors were encountered: