Home > jQuery > Menu 1

Menu 1

Dodane przez: piciu
opis:
Możliwość stosowania motywów menu z interakcji myszy i klawiatury do nawigacji.
Kod:
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>jQuery UI Menu - Default functionality</title>
  6. <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  7. <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  8. <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  9. <link rel="stylesheet" href="/resources/demos/style.css" />
  10. <script>
  11. $(function() {
  12. $( "#menu" ).menu();
  13. });
  14. </script>
  15. <style>
  16. .ui-menu { width: 150px; }
  17. </style>
  18. </head>
  19. <body>
  20. <ul id="menu">
  21. <li class="ui-state-disabled"><a href="#">Aberdeen</a></li>
  22. <li><a href="#">Ada</a></li>
  23. <li><a href="#">Adamsville</a></li>
  24. <li><a href="#">Addyston</a></li>
  25. <li>
  26. <a href="#">Delphi</a>
  27. <ul>
  28. <li class="ui-state-disabled"><a href="#">Ada</a></li>
  29. <li><a href="#">Saarland</a></li>
  30. <li><a href="#">Salzburg</a></li>
  31. </ul>
  32. </li>
  33. <li><a href="#">Saarland</a></li>
  34. <li>
  35. <a href="#">Salzburg</a>
  36. <ul>
  37. <li>
  38. <a href="#">Delphi</a>
  39. <ul>
  40. <li><a href="#">Ada</a></li>
  41. <li><a href="#">Saarland</a></li>
  42. <li><a href="#">Salzburg</a></li>
  43. </ul>
  44. </li>
  45. <li>
  46. <a href="#">Delphi</a>
  47. <ul>
  48. <li><a href="#">Ada</a></li>
  49. <li><a href="#">Saarland</a></li>
  50. <li><a href="#">Salzburg</a></li>
  51. </ul>
  52. </li>
  53. <li><a href="#">Perch</a></li>
  54. </ul>
  55. </li>
  56. <li class="ui-state-disabled"><a href="#">Amesville</a></li>
  57. </ul>
  58. </body>
  59. </html>

©