how to hide and display a menu using javascript?

Question

this is a menu item i need to display the menu only when browserName='mybrowser' otherwise i need to hide the menu. please help me how to hide and DISPLAY the menu? im using a javascript code for checking the condition.

<div id="ddtopmenubar" class="mattblackmenu">
        <ul>
          <li><a href="web-hosting.php" rel="ddsubmenu1">HOSTING SERVICES</a> </li>
          <li><a href="price-match.php" rel="ddsubmenu2">PRICE MATCH</a> </li>
          <li><a href="ircd-accounts.php" rel="ddsubmenu3">IRC/UNIX</a> </li>
          <li><a href="https://clients.santrex.net/knowledgebase.php" rel="ddsubmenu4">SUPPORT</a></li>
          <li id="last"><a href="ourhistory.php" rel="ddsubmenu5">ABOUT SANTREX</a></li>
        </ul>
      </div>

Answer 1

Code to hide menu:

document.getElementById('ddtopmenubar').style.display = 'none';

Code to display menu:

document.getElementById('ddtopmenubar').style.display = 'block';

Answer 2

Detecting browser:

var isOpera = !!(window.opera && window.opera.version);  // Opera 8.0+
var isFirefox = testCSS('MozBoxSizing');                 // FF 0.8+
var isSafari = Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor') > 0;
    // At least Safari 3+: "[object HTMLElementConstructor]"
var isChrome = !isSafari && testCSS('WebkitTransform');  // Chrome 1+
var isIE = /*@cc_on!@*/false || testCSS('msTransform');  // At least IE6
        if(isIE==true)//If IE, change it to any other as per need
        document.getElementById('ddtopmenubar').style.display = 'none';

Each test is fully independent of the other one, except for the Safari-Chrome test. To detect Chrome in a reliable way, you have to exclude Safari, since both share the webkit prefixes. But, if you only want to know whether the user is using Chrome 15+, the following can also be used:

 var isChrome = !!(window.chrome && chrome.webstore && chrome.webstore.install);

Fiddle here : http://jsfiddle.net/9zxvE/9/

or if you don't need browser detection

if( browserName='mybrowser' )
 document.getElementById('ddtopmenubar').style.display = 'none';

Answer 3

See Demo: http://jsfiddle.net/rathoreahsan/cQPtk/2/

Javascript:

    var mybrowser = navigator.appName;

    if (mybrowser == 'Netscape') /* Change browser name accordingly */
        { document.getElementById('ddtopmenubar').style.display = 'block' }
    else
        { document.getElementById('ddtopmenubar').style.display = 'none' }

Answer 4

document.getElementById('ddtopmenubar').style.display = 'none';
document.getElementById('ddtopmenubar').style.display = 'block';

Answer 5

Use jQuery.

Here's one way to do it:

http://jsfiddle.net/S8rtj/