jQuery: The Write Less, Do More JavaScript Library

Effects/toggle

From jQuery JavaScript Library

Jump to: navigation, search

« Back to Effects

[edit]

toggle( )

Toggles displaying each of the set of matched elements.
If they are shown, toggle makes them hidden. If they are hidden, toggle makes them shown.

Examples:
Toggles all paragraphs.

    $("button").click(function () {
      $("p").toggle();
    });



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  
  <script>
  $(document).ready(function(){
    
    $("button").click(function () {
      $("p").toggle();
    });

  });
  </script>
  
</head>
<body>
  <button>Toggle</button>
  <p>Hello</p>
  <p style="display: none">Good Bye</p>
</body>
</html>

NameType


Retrieved from "http://docs.jquery.com/Effects/toggle"