Javascript Menubar Tutorial with Examples

window.menubar

1. window.menubar

No ADS

The window.menubar property returns a Menubar object representing the menu bar on browser. However, you can hardly interact with Menubar through Javascript because it has very few APIs for you.

window.menubar

// Or simple:

menubar

The tendency of modern browsers is to make the Viewport window as wide as possible, therefore, they remove other components like Statusbar, or made Menubar smaller.

The illustration of the menu bar of the Firefox 1.0 browser.

Menu bar is shrunk in the modern Firefox version.

menubar.visible

The menubar.visible property returns true if menu bar is displayed on browser. On the contrary, it returns false.

Note: For modern browsers, you can set new values for menubar.visible. If you do it on purpose, it doesn't work.

menubar-example.html

<!DOCTYPE html>
<html>
<head>
    <title>Menubar</title>
    <meta charset="UTF-8">
</head>
<body>
    <h3>menubar.visible</h3>

    <br/><br/>
    <button onclick="alert(menubar.visible)">
        alert(menubar.visible)
    </button>

</body>
</html>

Example, use window.open(..) to open a new window without menu bar.

open-new-window-example.html

<!DOCTYPE html>
<html>
<head>
    <title>Menubar</title>
    <meta charset="UTF-8">
    <script>

        function openNewWindow()  {
           var winFeature = 'menubar=no,resizable=yes';

           // Open a New Windows.
           window.open('some-page.html','MyWinName',winFeature);
        }
    </script>
</head>
<body>
    <h3>Menubar</h3>

    <button onclick="openNewWindow()">
      Open a New Window without menubar
    </button>

</body>
</html>

some-page.html

<!DOCTYPE html>
<html>
<head>
    <title>Some Page</title>
    <meta charset="UTF-8">
</head>
<body onload="alert('menubar.visible? ' + menubar.visible)">
    <h3>Some Page</h3>

    <p>1</p>
    <p>1 2</p>
    <p>1 2 3</p>
</body>
</html>

No ADS

Javascript Menubar Tutorial with Examples

1. window.menubar

ECMAScript, Javascript Tutorials

ECMAScript, Javascript Tutorials

Newest Articles