Advertisement
Guest User

Untitled

a guest
Apr 23rd, 2014
44
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.40 KB | None | 0 0
  1. <nav id="site-navigation" class="main-navigation toggled" role="navigation">
  2. <h1 class="menu-toggle">+</h1>
  3.  
  4. <div class="menu">
  5. <ul class=" nav-menu">
  6. <li><a>Home</a>
  7. </li>
  8. <li><a>Contact</a>
  9. </li>
  10. <li><a>Sample Page</a>
  11. </li>
  12. <li><a>The Emperor’s New Clothes</a>
  13. </li>
  14. </ul>
  15. </div>
  16. </nav>
  17.  
  18. .menu-toggle {
  19. display: block;
  20. position: absolute;
  21. right: 45px;
  22. top: 20px;
  23. width: 25px;
  24. height: 25px;
  25. z-index: 999;
  26. font-size: 30px;
  27. line-height: 1;
  28. font-weight: 800;
  29. text-shadow: 2px 2px #fff;
  30. }
  31. .menu-open {
  32. -moz-transform: rotate(45deg);
  33. -webkit-transform: rotate(45deg);
  34. -o-transform: rotate(45deg);
  35. -ms-transform: rotate(45deg);
  36. transform: rotate(45deg);
  37. font-size: 30px;
  38. line-height: 1;
  39. font-weight: 800;
  40. text-shadow: 2px 2px SpringGreen;
  41. }
  42. .menu-toggle, .main-navigation.toggled .nav-menu {
  43. display: block;
  44. }
  45.  
  46. /**
  47. * navigation.js
  48. *
  49. * Handles toggling the navigation menu for small screens.
  50. */
  51. ( function() {
  52. var container, button, menu, menuToggle;
  53.  
  54. container = document.getElementById( 'site-navigation' );
  55. if ( ! container )
  56. return;
  57.  
  58. button = container.getElementsByTagName( 'h1' )[0];
  59. if ( 'undefined' === typeof button )
  60. return;
  61.  
  62. menu = container.getElementsByTagName( 'ul' )[0];
  63.  
  64. menuToggle = container.getElementsByClassName( 'menu-toggle' )[0];
  65.  
  66. // Hide menu toggle button if menu is empty and return early.
  67. if ( 'undefined' === typeof menu ) {
  68. button.style.display = 'none';
  69. return;
  70. }
  71.  
  72. if ( -1 === menu.className.indexOf( 'nav-menu' ) )
  73. menu.className += ' nav-menu';
  74.  
  75. button.onclick = function() {
  76.  
  77. if ( -1 !== container.className.indexOf( 'toggled' ) )
  78. container.className = container.className.replace( 'toggled', '' );
  79. else
  80. container.className += 'toggled';
  81. }
  82.  
  83. } )();
  84.  
  85.  
  86. /* $(this).toggleClass('menu-open'); */
  87.  
  88. button.addEventListener("click", function() {
  89. // Code here
  90. }, false);
  91.  
  92. button.attachEvent("onclick", function() {
  93. // Code here
  94. });
  95.  
  96. if (button.addEventListener) {
  97. button.addEventListener("click", handleTheEvent, false);
  98. }
  99. else if (button.attachEvent) {
  100. button.attachEvent("onclick", handleTheEvent);
  101. }
  102.  
  103. function handleTheEvent() {
  104. // ...code here...
  105. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement