open

Triggered before the responsive panel is opened. Cancellable.

Attach open event handler during initialization

<nav id="navigation">
    <a href="#">Home</a>
    <a href="#">Products</a>
</nav>

<article>
    <button class="k-rpanel-toggle"><span class="k-icon k-i-menu"></span></button>

    Content
</article>

<script>
    // event handler for open event
    var onOpen = function() {
        // the responsive panel is opening
/* The result can be observed in the DevTools(F12) console of the browser. */
        console.log("opening");
    };

    // attach open event handler during initialization
    $("#navigation").kendoResponsivePanel({
        open: onOpen
    });
</script>

Attach open event handler via bind(); detach via unbind()

<nav id="navigation">
    <a href="#">Home</a>
    <a href="#">Products</a>
</nav>

<article>
    <button class="k-rpanel-toggle"><span class="k-icon k-i-menu"></span></button>

    Content
</article>

<script>
    $("#navigation").kendoResponsivePanel();

    // event handler for open event
    var onOpen = function() {
        // the responsive panel is opening
/* The result can be observed in the DevTools(F12) console of the browser. */
        console.log("opening");
    };

    // attach open event handler via bind()
    $("#navigation").data("kendoResponsivePanel").bind("open", onOpen);
</script>
In this article