Advanced Search

Simple Show/Hide Panel

/ Published in: jQuery
Save to your folder(s)
Simple Show/Hide Panel we learned in class for an assignment.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <script type="text/javascript" src="jquery.js">
  2. </script> <script type="text/javascript">
  3. /* <![CDATA[ */
  4. // Jquery implementation of Show/Hide Panel for Instructions
  5. $(document).ready(function(){
  6.   $(".showhide").click(function(){
  7.     $(".panel").slideToggle("slow");
  8.   });
  9. });
  10. /*]]>*/
  11. </script>
  12. <div class="c2">
  13. <p class="showhide">Click to Show/Hide Instructions</p>
  14. <div class="panel">
  15. <p>Jquery testing of .slideToggle</p>
  16. <div class="c1">
  17. Testing Show/Hide Instructions
  18. </div>
  19. </div>

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.