ziyas

tabs thingy?

Apr 8th, 2022 (edited)
1,616
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.08 KB | None | 0 0
  1. <head>
  2. <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  3. <link rel="stylesheet" href="/resources/demos/style.css">
  4. <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  5. <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  6. <script>
  7. $( function() {
  8. $( "#tabs" ).tabs();
  9. } );
  10. </script>
  11. <link rel="preconnect" href="https://fonts.googleapis.com">
  12. <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  13. <link href="https://fonts.googleapis.com/css2?family=Mali&display=swap" rel="stylesheet">
  14. <style>
  15. @font-face {
  16. font-family:'PingWing';
  17. src: url(https://dl.dropbox.com/s/5z5897hywveuh17/pingwing.ttf);
  18. }
  19. #tabs {
  20. background: pink;
  21. font-family: 'Mali', cursive;
  22. font-size: 14px;
  23. }
  24. #tabs p {
  25. color: black;
  26. line-height: 1.2em;
  27. }
  28. #tabs li {
  29. background: pink;
  30. border: none;
  31. font-family:'PingWing';
  32. }
  33. #tabs li:hover, #tabs li:active {
  34. transition: 0.5s; /* how fast/slow the transition will be */
  35. webkit-filter: blur(1px); /* you can change the blur amount here */
  36. filter: blur(1px);
  37. }
  38. #tabs ul {
  39. background: black;
  40. border: none;
  41. padding-top: .4em;
  42. padding-left: .5em;
  43. }
  44. </style>
  45. </head>
  46. <body>
  47. <div id="tabs">
  48. <ul>
  49. <li><a href="#tabs-1">One</a></li>
  50. <li><a href="#tabs-2">Two</a></li>
  51. <li><a href="#tabs-3">Three</a></li>
  52. </ul>
  53. <div id="tabs-1">
  54. <p>Candy danish icing chocolate cake caramels sweet apple pie powder. Cupcake candy gingerbread pastry biscuit bear claw toffee sweet. Cookie brownie gummies gingerbread donut. Macaroon ice cream pudding apple pie gummies.</p>
  55. </div>
  56. <div id="tabs-2">
  57. <p>Halvah topping pastry macaroon marshmallow tart sweet roll. Topping tart tart sweet dessert tootsie roll dulce de leche. Candy oat cake dessert caramels lollipop halvah halvah apple pie. Sugar plum sweet gummi bears chocolate bar liquorice.</p>
  58. </div>
  59. <div id="tabs-3">
  60. <p>Gummies bonbon jelly wafer tiramisu. Sweet chocolate chocolate lemon drops cupcake pie sweet roll cake liquorice. Candy canes chocolate bar chocolate muffin marshmallow donut dragée pastry pudding.</p>
  61. </div>
  62. </div>
  63. </body>
Add Comment
Please, Sign In to add comment