jquery - 絶対配置DivのJqueryスライド効果

Question

一部の でスライド効果 (この場合はslideToggle) を使用すると問題が発生しますposition:absolute Divs。

作業を完了する前にposition-境界線の矢印に必要でした-完全に機能しました。しかし、私が使用position:absoluteしdivsた後、効果はもう機能しません。それで、私はそれがDiv存在しない場所で行われる効果と関係があると思いますか?

私のHTML：

<div style="width: 200px; border-width: 1px; border: dotted" onclick="clickDiv();">
    click me
</div>
<div id="DivTeste">
    <div class="chat-bubble-arrow-border"></div>
    <div class="chat-bubble-arrow"></div>
    <div class="teste box">
        <p>e</p>
        <p>e</p>
        <p>e</p>
        <p>e</p>
        <p>e</p>
    </div>
</div>

私のCSS：

.box {
   overflow: auto;
   display: block;
   height:100px;
   width: 200px;
   border-width: 1px;
   border: solid;
   top: 50px;
   position:absolute;
}

.chat-bubble-arrow-border {
   border-color: transparent transparent #000 transparent;
   border-style: solid;
   border-width: 10px;
   height:0;
   width:0;
   position:absolute;
   top: 30px;
   left:30px;
}


.chat-bubble-arrow {
   border-color: transparent transparent #fff transparent;
   border-style: solid;
   border-width: 10px;
   height: 0;
   width: 0;
   position: absolute;
   left: 30px;
   top: 33px;
   z-index: 100;
}

そして私のJS：

$(function () {
   $('#DivTeste').hide();
});

function clickDiv() {
   $('#DivTeste').slideToggle();
}