Facebook
From ja, 3 Years ago, written in Plain Text.
Embed
Download Paste or View Raw
Hits: 232
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type"  content="text/html" charset="UTF-8" />
  5. <title>  inf rozwijania  </title>
  6. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  7. </head>
  8. <style>
  9. body {
  10. margin:10px auto;
  11. width:600px;
  12. }
  13. .blok {
  14. width: 450px;
  15. border-bottom: solid  lpxx #b0b0b0;
  16. }
  17.  
  18. .blok  h3 {
  19. background  # c6d2f2  ;
  20. padding: 8px 15px;
  21. margin: 0;
  22. font: bold 12pt  Arial, sans-serif;
  23. border: solid lpxx #b0b0b0;
  24. border-bottom: none;
  25. cursor: pointer;
  26. }
  27.  
  28. .blok h3:hover  {
  29. background-color #88a3e8;
  30. }
  31.  
  32. .blok  h3.aktywny {
  33. background-color:  #88a3e8;
  34. }
  35.  
  36. .blok p  {
  37. background: #ele6f4;
  38. margin:  0;
  39. padding:  10px 15px 20x;
  40. border-left: solid  lpx  #c4c4c4;
  41. border-right: solid 1px #c4c4c4;
  42. font: 10pt Arial,  san-serif;
  43. display: none;
  44. }
  45. </style>
  46. <script>
  47.    $(document).ready(function(){
  48.    $(".blok h3").eq(0).addClass("aktywny");
  49.    $(".blok p").eq(0).show();
  50.    $(".blok h3").click(function() {
  51.    $(this).next("p").slideToggle("slow").siblings("p:visible").slideUp("slow")("p:visible").slideUp("slow");
  52.    $(this).toogleClass("aktywny");
  53.    $(this).siblings("h3").removeClass("aktywny");
  54.    });
  55. });
  56. </script>
  57. <body>
  58. <div class="blok">
  59. <h3>Menu</h3>
  60. <p>dupeczka</p>
  61. <h3>Menu2</h3>
  62. <p>Siema</p>
  63. <h3>Menu3</h3>
  64. <p>Elo</p>
  65. </div>
  66. </body>
  67. </html>