Show/Hide button doesn't work on Mac

So the show/hide button works fine in all the browsers on Windows, but doesn't work as expected in Safari and Google Chrome on Mac. It either doesn't show/hide the list at all, or shows only partial items... I use (Son of) Suckerfish

for the multi-level dropdown. Here is the URL: http://eximi.dreamhosters.com/Hawaii/pkdiet/pkd.php

JavaScript for the show/hide button:

function toggleDiv()  
      {  
        if (document.getElementById("submenu").style.display == "block")  
        {  
          document.getElementById("submenu").style.display = "none";  
        }  
        else  
        {  
          document.getElementById("submenu").style.display开发者_如何转开发 = "block";  
        }  
      }

CSS for 'suckerfish' part:

#nav, #nav ul {
    float: left;
    width: 14em;
    list-style: none;
    line-height: 1;
    font-family: Tunga, sans-serif;
    font-size: 12px;
    font-weight: bold;
    padding: 0;
    margin: 0 0 1em 0;
}

#nav a {
    display: block;
    width: 10em;
    w\idth: 6em;
    color: #996637;
    text-decoration: none;
    padding: 0.25em 2em;
}

#nav a.daddy {
    background: url(rightarrow2.gif) center right no-repeat;
}

#nav li {
    /*float: left;*/
    padding: 0;
    width: 10em;
}

#nav li ul {
    position: absolute;
    left: -999em;
    height: auto;
    width: 14.4em;

    font-weight: normal;
    border-width: 0.25em;
    margin-left : 10.05em;
    margin-top : -1.35em;
}

#nav li li {
    padding-right: 1em;
    width: 13em
}

#nav li ul a {
    width: 13em;
    w\idth: 9em;
}

#nav li ul ul {
    margin: -1.75em 0 0 14em;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
    left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
    left: auto;
}

You can see the HTML in the source code on the URL above. Thank you!

in you suckerfish.js I am getting this errors on google chrome:

uncought SyntaxError: unexpectect token <

While in Firefox it works but is throwing me this error:

XML can't be the whole program 
//--><!]]></script>

It seems that your XML structure comments are messing you up, the only difference is that chrome stops at the begging in line one and firefox at the end

I get the error:

Uncaught TypeError: Cannot read property 'style' of null

I guess there is no element with ID "submenu" on your page of some reason.

As well in Chrome the input element containing the "onClick" function is slightly above the button.

Your problem is not in the script itself, but in the way you formed the script tag:

<script type="text/javascript"><!--//--><![CDATA[//><!--
...
//--><!]]></script>

This can just be:

<script type="text/javascript">
...
</script>

Or if you feel like keeping the CDATA for XML validation:

<script type="text/javascript">
//<![CDATA[
...
//]]>
</script>

suckerfish:js Line 1: Uncaught SyntaxError: Unexpected token <

Get that out of there and you're good to go.