Here you can find some useful tips and tricks and the answers to the most frequently asked questions. Can't find what you're looking for? Try asking your question on stackoverflow.com.
Basic CSS tips
Set a background(-color)
on the <body>
.
Here you can find some useful tips and tricks and the answers to the most frequently asked questions. Can't find what you're looking for? Try asking your question on stackoverflow.com.
Set a background(-color)
on the <body>
.
<style>
body {
background-color: #fff;
}
</style>
Hide the menu until the document is done loading.
<style>
#menu:not( .mm-menu ) {
display: none;
}
</style>
If you only want to use the mmenu.js plugin for the menu on a smaller screen, don't try to destroy and (re)create the menu when the window resizes. That won't work because the plugin makes a lot of modifications to the HTML that can not be reverted. Instead, you should (let the plugin) clone the menu and use CSS to show and hide either the original or cloned menu using media queries.
<script>
new Mmenu( "#menu", {
// options
}, {
// configuration
offCanvas: {
clone: true
}
});
</script>
Use CSS to show and hide the original or cloned menu depending on the width of the screen. Note that all ID's in the cloned menu will be prepended with "mm-":
<style>
@media (max-width: 1023px) {
#menu {
display: none !important;
}
}
@media (min-width: 1024px) {
#mm-menu{
display: none !important;
}
}
</style>