JavaScript DHTML/jQuery/hide

Материал из Web эксперт
Перейти к: навигация, поиск

Animates all shown paragraphs to hide slowly, completing the animation within 600 milliseconds.

 

<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
            $("button").click(function () {
              $("p").hide("slow");
            });   
        });
    </script>
  </head>
  <body>
    <body>
          <button>Hide</button>
          <p>asdf</p>
    </body>
</html>



Click to hide

    
<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){

                $("p").click(function () {
                  $(this).hide();
                  return true;
                });


        });
    </script>
  </head>
  <body>
    <body>
        <p>Hello</p>
    </body>
</html>



Hide and remove

    
<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){

                $("p").hide(2000, function () {
                        $(this).remove();
                });


        });
    </script>
  </head>
  <body>
    <body>
        <p>Hello</p>
    </body>
</html>



Hide a tag

    
<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
        
             $("p").hide();


        });
    </script>
  </head>
  <body>
    <body>
        <p>Hello</p>
    </body>
</html>



Hide fast

    
<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){

                $("p").click(function () {
                  $(this).hide("fast");
                  return true;
                });


        });
    </script>
  </head>
  <body>
    <body>
        <p>Hello</p>
    </body>
</html>



Hide in millisecond

    
<html>
  <head>
    <script type="text/javascript" src="js/jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){

                $("p").click(function () {
                  $(this).hide(2000);
                  return true;
                });


        });
    </script>
  </head>
  <body>
    <body>
        <p>Hello</p>
    </body>
</html>