javascript - Sliding DIV コード Javascript の小さな問題

Question

クライアント サイトの単純なスライド div 用に作成したコードに若干の問題があります。

コードは div の高さを検出し (長さはページごとに異なるため)、div を 100px の高さに設定する必要があります。現時点での問題は、JavaScript がサイズを変更する前に、div の全長が 0.5 秒間表示されることです。詳細情報をクリックしないとdivの全長がユーザーに表示されないように、コードを変更するのを手伝ってくれる人はいますか?

JS は次のとおりです。

    function heightGet(){
    var moreinfoHeight = document.getElementById("moreinfo").clientHeight;
    var moreinfo = document.getElementById("moreinfo"); 
    moreinfo.style.height = moreinfoHeight + "px";
    moreinfo.style.visibility = "visible";
    document.getElementById("moreinfo_button").href="javascript:heightMore(" + moreinfoHeight + ");";
    document.getElementById("moreinfo_button").innerHTML="More Info";
    heightLess(moreinfoHeight);
} 

function heightMore(val){
    var moreinfo = document.getElementById("moreinfo");

    document.getElementById("moreinfo_button").href="javascript:heightLess(" + val + ");";
    document.getElementById("moreinfo_button").innerHTML="Less Info";

    moreinfo.style.height = val + "px";
    alert(div.height);
    /*setTimeout( function() {
                              // here add the code (or call a function) to be executed after pause
                          moreinfo.style.height = "100%";
                          }, 500 );*/
} 

function heightLess(val){
    var moreinfo = document.getElementById("moreinfo");

    document.getElementById("moreinfo_button").href="javascript:heightMore(" + val + ");";
    document.getElementById("moreinfo_button").innerHTML="More Info";

    moreinfo.style.height = "100px";

} 

heightGet はページの読み込み時にトリガーされ、heightMore はボタンを押して詳細情報を取得したときにトリガーされ、heightLess の場合はその逆です。