滑动的Ajax响应打开div

Question

好的，这是继我之前的问题之后，再次执行一个简单的ajax请求，一旦请求返回了readyState为4且状态为200的请求，它将响应插入div并很好地向下滑动。 我不希望使用jQuery或scriptalicious之类的工具包来执行它。

这是原始问题：
使用工具包的Ajax具有幻灯片效果，可以立即使用

到目前为止，我已经设法使其全部正常运行。 但是我有一个问题，显示返回的文本，然后div扩展。 我需要它与div和文本一起扩展。

这是我的代码

function slideDown()
{
    document.getElementById('slideDiv').style.visibility = 'hidden';
    xmlhttp.open("GET", "parse.php?what=main", true);
    xmlhttp.onreadystatechange = function()
    {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
        {
            document.getElementById('butt').value = 'hide';
            document.getElementById('slideDiv').innerHTML = xmlhttp.responseText;
            document.getElementById('slideDiv').style.display = 'block';
            var fHeight = document.getElementById('slideDiv').offsetHeight;
            document.getElementById('slideDiv').style.height = '0';
            document.getElementById('slideDiv').style.visibility = 'hidden';
            function timeIt()
            {
                function bar()
                {
                    timeSlide(fHeight);
                }
                setTimeout(bar, 10);
            }
            timeIt();
        }
    }
    xmlhttp.send(null); 
}

function timeSlide(fHeight)
{
    var fHeight;
    var diff;
    document.getElementById('slideDiv').style.visibility = 'visible';
    var cHeight = document.getElementById('slideDiv').clientHeight;
    if (cHeight < fHeight)
    {
        cHeight = cHeight + 3;
        document.getElementById('slideDiv').style.height = cHeight+'px';
        function timeIt()
        {
            function bar()
            {
                timeSlide(fHeight);
            }   
            setTimeout(bar, 10);
        }
        timeIt();
    }
    else
    {
        endSlide();
    }
}

我认为这是由于使用以下命令将返回的get请求放入div而发生的。

document.getElementById('slideDiv').innerHTML = xmlhttp.responseText;

有人可以请我朝正确的方向吗？ 我对JavaScript并不是特别擅长，我可能会采用完全错误的方式，因此任何指针都很棒！ 提前致谢！

Answer 1

如果看不到它，很难说，但是尝试添加以下内容：

document.getElementById('slideDiv').style.overflow = 'hidden';