Javascript下拉菜单

在我的网站底部，我将有一个用于即时聊天的下拉菜单部分。我正在使用Javascript调出菜单

我有一个id为“chatTab”的选项卡，实际的聊天信息会显示在id为“chat”的选项卡中。“聊天”选项卡位于页面底部，直到您单击它，然后它就会与聊天一起出现。问题是，它不会停下来。我已经在选项卡划分中使用了onClick方法，并确认它是有效的，所以问题出在JS中的某个地方

var current;
var pullChat = 0;
var pullMenu = function() {
    if(pullChat === 0) {
        current = document.getElementById('chatTab');
        current.style.bottom = '300';
        alert('pie');
        current = document.getElementById('chat');
        current.style.bottom = '0'; //starts at -300
    }
}

警报消息是我用来测试一行代码是否运行的东西，在这种情况下它确实会运行

我的HTML很长，但有两件事很重要：

<div id='chatTab' onClick='pullMenu()'>Instant Chat</div>
<div id='chat'></div>

---

CSS

bottom

属性需要一个长度值<代码>300不是长度。它不是

0

，也没有单元

---

你可能是说

'300px'

你能同时包含必要的HTML标记吗？好的，我添加了两个重要的东西。HTML的其余部分与此无关。@turkey3旁注：鉴于您提出了许多问题，您应该接受已经解决部分或全部问题的答案，包括您今天的最新问题。如果你不知道怎么做，请看下面的链接-堆栈系统的构建是有原因的。我怎么没看到呢！谢谢。@turkey3如果这解决了你的问题，就把它标记为正确答案。我不能，我需要更好的答案reputation@turkey3勾选白色/灰色复选标记，直到答案旁边的上下箭头下方变为绿色。看这里

#chatTab {
    z-index:1000;
    position:fixed;
    bottom:0;
    background-color:#FF9933;
    color:white;
    width:100%;
    margin:0;
    padding:0;
    text-align:center;
    font-size:1.8em;
}
#chatTab:hover {
    cursor:pointer;
}
#chat {
    z-index:1001;
    position:fixed;
    padding:0;
    margin:0;
    bottom:-300px;
    height:300px;
}