Fixed elements introduction

If your page contains elements with position: fixed; that suddenly disappear when opening the menu, add the classname Fixed to the elements.

<div id="my-page">
    <div id="my-header" class="Fixed">
        The header.
    <div id="my-content">
        Some text.

If you're using a different classname (for example "fix"), you must specify this in the classNames.fixedElements.fixed options in the configuration object.

        "DOMContentLoaded", () => {
            new Mmenu( "#my-menu", {
                // options
            }, {
                // configuration
                classNames: {
                    fixedElements: {
                        fixed: "fix"

Note that, where possible, it is advised to use position: stikcy; in favor of position: fixed; due to the better default behavior.

Options for the "fixedElements" add-on

The "fixedElements" add-on has no options.

Configuration for the "fixedElements" add-on

Option Datatype Default value Description
insertMethod String "append" How to insert the fixed element to the DOM.
Possible values: "prepend" and "append".
insertSelector String "body" Query selector for the element the fixed element should be inserted in.

The "fixedElements" add-on also adds an object to the classNames option.

    Mmenu.configs.classNames.fixedElements = {
        fixed: "Fixed"

CSS variables for the "fixedElements" add-on

The "fixedElements" add-on has no CSS variables.

SCSS variables for the "fixedElements" add-on

The "fixedElements" add-on has no SCSS variables.

API methods for the "fixedElements" add-on

The "fixedElements" add-on has no API methods.

Next add-on: