jQuery HTML Element How to - Animate all paragraphs to slide up or down, completing the animation within 600 milliseconds

Question

We would like to know how to animate all paragraphs to slide up or down, completing the animation within 600 milliseconds.

Answer


<!--  w  ww  .j  av  a 2 s .  c o  m-->
<html>
  <head>
    <script type="text/javascript" src='http://code.jquery.com/jquery-1.5.2.js'></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("button").click(function () {
              $("p").slideToggle("slow");
            });
        });
    </script>
  </head>
  <body>
          <button>Toggle</button>
          <p>
            This is the paragraph.
          </p>
  </body>
</html>

The code above is rendered as follows: