JS隐藏显示左侧菜单

<script language="javascript" type="text/javascript">
    function HideShow()
    {
        var alt = document.getElementById('switchPoint').alt;
        var src = document.getElementById('switchPoint').src;
        if (alt == "隐藏")
        {
            document.getElementById('switchPoint').alt = "显示";
            document.getElementById('switchPoint').src = src.substring(0, src.length - 8) + "show.jpg";
            document.all("leftFrame").style.display = "none";
        }
        else
        {
            document.getElementById('switchPoint').alt = "隐藏";
            document.getElementById('switchPoint').src = src.substring(0, src.length - 8) + "hide.jpg";
            document.all("leftFrame").style.display = "";
        }
    }
</script>

<table border="0" cellpadding="0" cellspacing="0" width="100%" style="height: 100%">
                <tr>
                    <td bgcolor="#0A5C8E" width="8px">
                        &nbsp;</td>
                    <td width="170px" valign="top" id="leftFrame">  
                        <uc2:left ID="left1" runat="server" />
                    </td>
                    <td bgcolor="#0A5C8E" width="10px">
                        <img src="images/hide.jpg" alt="隐藏" id="switchPoint" οnclick="HideShow()" style="cursor:hand"/>
                    </td>
                    <td align="left" valign="top" height="620px">
                        <iframe id="rightFrame" name="main" frameborder="0" scrolling="yes"  src="main.aspx" height="100%" width="100%" ></iframe>
                        &nbsp;</td>
                    <td bgcolor="#0A5C8E" width="8px">
                        &nbsp;</td>
                </tr>
</table>