Как развернуть Div плавно?

Question

У меня есть div, который расширяется в зависимости от результата выбора, с высотой, установленной в «auto». Я хочу сделать это расширение мягким, это очень сложно.

Сценарий, используемый для расширения и сворачивания DIV ::

<script type="text/javascript"> 
     function ShowHideDIV(NomeDIV, Valor) { 
      Valor = document.getElementById("Lista").value; 
      if (Valor == "Sim") { 
       document.getElementById(NomeDIV).style.display = "block"; 
      } else { 
       document.getElementById(NomeDIV).style.display = "none"; 
      } 
     } 
</script> 

Parent DIV (к которому я хочу поставить эффект):

<div class="bgCotar"></div> 

Select (ответственный за расширение Родитель DIV):

<div class="campo" id="campo4"> 
    <label>Incluir Dependentes?</label><br /> 
    <select name="Lista" size="1" id="Lista" 
    onChange="ShowHideDIV('CampoOculto','Sim');"> 
     <option value="0">Selecione...</option> 
     <option value="Sim">Sim</option> 
     <option value="Nao">Não</option> 
    </select>          
</div> 

пример того, что я задаюсь вопросом: http://www.maujor.com/blog/pg_apoio/jquery-toggle-texto-exemplo.html

Извините за мой плохой английский, мой язык - португальский.

Answer 1

Вы должны взглянуть на jquery. Он имеет некоторые хорошие эффекты, чтобы делать то, что вы хотите. Кроме того, вы можете использовать функцию animate() jquery.

http://www.w3schools.com/jquery/jquery_animate.asp

http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_slide_toggle

Answer 2

На сайте вы показали использует JQuery - функциональность slideToggle - http://api.jquery.com/slideToggle/. Используйте это, чтобы оживить вашу страницу