Ответ на Ajax, который открывает слайды div

Question

Хорошо, это вытекает из моего предыдущего вопроса, в котором вы можете выполнить простой запрос ajax, который после того, как запрос вернул readyState из 4 и статус 200, он вставляет ответ в div и хорошо слайд-шоу. Я не хочу, чтобы это выполнялось с помощью инструментария, такого как jQuery или scriptalicious.

здесь оригинальный вопрос:
Ajax with slide effects onready witout using a toolkit

До сих пор мне удалось получить все это работает довольно хорошо. Однако у меня есть проблема, что текст возвращается, а затем 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(); 
    } 
} 

Я думаю это происходит за счет использования следующих поставить запрос возвращаемый попасть в DIV.

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

Может кто-нибудь, пожалуйста, поставил меня в правильном направлении? Я не очень хорошо разбираюсь в JavaScript, и я, вероятно, ошибаюсь в этом, поэтому любые указатели будут замечательными! Заранее спасибо!

Answer 1

Трудно сказать, не видя его в действии, но попробуйте добавить следующее:

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