snipplrCallback({"id":100144,"title":"hover-menu-html","source":"
  1. <!DOCTYPE html><\/span><\/div><\/li>
  2. <html<\/span><\/a> lang<\/span>=<\/span>"en"<\/span>><\/span><\/div><\/li>
  3. <head<\/span><\/a>><\/span><\/div><\/li>
  4.   <title<\/span><\/a>><\/span>Dynamic Hover Menu<\/<\/span>title<\/span><\/a>><\/span><\/div><\/li>
  5.   <meta<\/span><\/a> charset<\/span>=<\/span>"utf-8"<\/span>><\/span><\/div><\/li>
  6.   <meta<\/span><\/a> name<\/span>=<\/span>"viewport"<\/span> content<\/span>=<\/span>"width=device-width, initial-scale=1"<\/span>><\/span><\/div><\/li>
  7.   <link<\/span><\/a> rel<\/span>=<\/span>"stylesheet"<\/span> href<\/span>=<\/span>"masterstylesheet.css"<\/span> type<\/span>=<\/span>"text\/css"<\/span>><\/span><\/div><\/li>
  8. <\/<\/span>head<\/span><\/a>><\/span><\/div><\/li>
  9. <body<\/span><\/a>><\/span><\/div><\/li>
  10. <div<\/span><\/a> class<\/span>=<\/span>"masthead"<\/span>><\/span><\/div><\/li>
  11. \t<h1<\/span><\/a> class<\/span>=<\/span>"header"<\/span>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>Co Name<\/<\/span>a<\/span><\/a>><\/<\/span>h1<\/span><\/a>><\/span><\/div><\/li>
  12. \t<nav class<\/span>=<\/span>"navbar"<\/span> role=<\/span>"navigation"<\/span>><\/span><\/div><\/li>
  13. \t\t<ul<\/span><\/a>><\/span><\/div><\/li>
  14. \t\t\t<li<\/span><\/a>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>Link 8<\/<\/span>a<\/span><\/a>><\/<\/span>li<\/span><\/a>><\/span><\/div><\/li>
  15. \t\t\t<li<\/span><\/a>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>Link 7<\/<\/span>a<\/span><\/a>><\/<\/span>li<\/span><\/a>><\/span><\/div><\/li>
  16. \t\t\t<li<\/span><\/a>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>Link 6<\/<\/span>a<\/span><\/a>><\/<\/span>li<\/span><\/a>><\/span><\/div><\/li>
  17. \t\t\t<li<\/span><\/a>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>Home<\/<\/span>a<\/span><\/a>><\/<\/span>li<\/span><\/a>><\/span><\/div><\/li>
  18. \t\t<\/<\/span>ul<\/span><\/a>><\/span><\/div><\/li>
  19. \t<\/<\/span>nav><\/span><\/div><\/li>
  20. <\/<\/span>div<\/span><\/a>><\/span><\/div><\/li>
  21. <div<\/span><\/a> class<\/span>=<\/span>"face"<\/span>><\/span><\/div><\/li>
  22. \t<div<\/span><\/a> class<\/span>=<\/span>"bodylinks"<\/span>><\/span><\/div><\/li>
  23. \t\t<a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>Body Link 1<\/<\/span>a<\/span><\/a>><\/span><\/div><\/li>
  24. \t\t<a<\/span><\/a> class<\/span>=<\/span>"active"<\/span> href<\/span>=<\/span>"index1.html"<\/span>><\/span>Body Link 2<\/<\/span>a<\/span><\/a>><\/span> <!-- class "active" to show how active link will look --><\/span><\/div><\/li>
  25. \t\t<a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>Body Link 3<\/<\/span>a<\/span><\/a>><\/span><\/div><\/li>
  26. \t\t<a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>Body Link 4<\/<\/span>a<\/span><\/a>><\/span><\/div><\/li>
  27. \t\t<a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>Body Link 5<\/<\/span>a<\/span><\/a>><\/span><\/div><\/li>
  28. \t<\/<\/span>div<\/span><\/a>><\/span><\/div><\/li>
  29. \t<article class<\/span>=<\/span>"content"<\/span>><\/span>  <!-- Random Text Follows --><\/span><\/div><\/li>
  30. \t\t<header><\/span><\/div><\/li>
  31. \t\t\t<h3<\/span><\/a>><\/span><\/div><\/li>
  32. \t\t\tHome Page<\/div><\/li>
  33. \t\t\t<\/<\/span>h3<\/span><\/a>><\/span><\/div><\/li>
  34. \t\t<\/<\/span>header><\/span>\t\t<\/div><\/li>
  35. \t\t<p<\/span><\/a>><\/<\/span>p<\/span><\/a>><\/span><\/div><\/li>
  36. \t\t<p<\/span><\/a>><\/span><\/div><\/li>
  37. \t\tLorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas porttitor congue massa. Fusce posuere, magna sed pulvinar ultricies, purus lectus malesuada libero, sit amet commodo magna eros quis urna.<\/div><\/li>
  38. \t\t<\/<\/span>p<\/span><\/a>><\/span><\/div><\/li>
  39. \t\t<p<\/span><\/a>><\/span><\/div><\/li>
  40. \t\tNunc viverra imperdiet enim. Fusce est. Vivamus a tellus.<\/div><\/li>
  41. \t\t<\/<\/span>p<\/span><\/a>><\/span><\/div><\/li>
  42. \t\tPellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin pharetra nonummy pede. Mauris et orci.<\/div><\/li>
  43. \t\t<p<\/span><\/a>><\/span><\/div><\/li>
  44. \t\tDonec blandit feugiat ligula. Donec hendrerit, felis et imperdiet euismod, purus ipsum pretium metus, in lacinia nulla nisl eget sapien. Donec ut est in lectus consequat consequat.<\/div><\/li>
  45. \t\t<\/<\/span>p<\/span><\/a>><\/span><\/div><\/li>
  46. \t\t<p<\/span><\/a>><\/span><\/div><\/li>
  47. \t\tAenean nec lorem. In porttitor. Donec laoreet nonummy augue.<\/div><\/li>
  48. \t\t<\/<\/span>p<\/span><\/a>><\/span><\/div><\/li>
  49. \t\t<p<\/span><\/a>><\/span><\/div><\/li>
  50. \t\tSuspendisse dui purus, scelerisque at, vulputate vitae, pretium mattis, nunc. Mauris eget neque at sem venenatis eleifend. Ut nonummy.<\/div><\/li>
  51. \t\t<\/<\/span>p<\/span><\/a>><\/span><\/div><\/li>
  52. \t\t<p<\/span><\/a>><\/span><\/div><\/li>
  53. \t\tLorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas porttitor congue massa. Fusce posuere, magna sed pulvinar ultricies, purus lectus malesuada libero, sit amet commodo magna eros quis urna.<\/div><\/li>
  54. \t\t<\/<\/span>p<\/span><\/a>><\/span><\/div><\/li>
  55. \t\t<p<\/span><\/a>><\/span><\/div><\/li>
  56. \t\tNunc viverra imperdiet enim. Fusce est. Vivamus a tellus.<\/div><\/li>
  57. \t\t<\/<\/span>p<\/span><\/a>><\/span><\/div><\/li>
  58. \t\tPellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin pharetra nonummy pede. Mauris et orci.<\/div><\/li>
  59. \t\t<p<\/span><\/a>><\/span><\/div><\/li>
  60. \t\tDonec blandit feugiat ligula. Donec hendrerit, felis et imperdiet euismod, purus ipsum pretium metus, in lacinia nulla nisl eget sapien. Donec ut est in lectus consequat consequat.<\/div><\/li>
  61. \t\t<\/<\/span>p<\/span><\/a>><\/span><\/div><\/li>
  62. \t\t<p<\/span><\/a>><\/span><\/div><\/li>
  63. \t\tAenean nec lorem. In porttitor. Donec laoreet nonummy augue.<\/div><\/li>
  64. \t\t<\/<\/span>p<\/span><\/a>><\/span><\/div><\/li>
  65. \t\t<p<\/span><\/a>><\/span><\/div><\/li>
  66. \t\tSuspendisse dui purus, scelerisque at, vulputate vitae, pretium mattis, nunc. Mauris eget neque at sem venenatis eleifend. Ut nonummy.<\/div><\/li>
  67. \t\t<\/<\/span>p<\/span><\/a>><\/span><\/div><\/li>
  68. \t\t<p<\/span><\/a>><\/span><\/div><\/li>
  69. \t\tProin nec augue. Quisque aliquam tempor magna. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.<\/div><\/li>
  70. \t\t<\/<\/span>p<\/span><\/a>><\/span><\/div><\/li>
  71. \t\t<footer><\/span><\/div><\/li>
  72. \t\tNunc ac magna. Maecenas odio dolors.<\/div><\/li>
  73. \t\t<\/<\/span>footer><\/span><\/div><\/li>
  74. \t<\/<\/span>article><\/span><\/div><\/li>
  75. <\/<\/span>div<\/span><\/a>><\/span><\/div><\/li>
  76. <div<\/span><\/a> class<\/span>=<\/span>"pagefooter"<\/span>><\/span><\/div><\/li>
  77. \t<nav class<\/span>=<\/span>"bottomnavbar"<\/span>><\/span><\/div><\/li>
  78. \t\t<ul<\/span><\/a>><\/span><\/div><\/li>
  79. \t\t\t<li<\/span><\/a>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>|| Home |<\/<\/span>a<\/span><\/a>><\/<\/span>li<\/span><\/a>><\/span><\/div><\/li>
  80. \t\t\t<li<\/span><\/a>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>| Link 1 |<\/<\/span>a<\/span><\/a>><\/<\/span>li<\/span><\/a>><\/span><\/div><\/li>
  81. \t\t\t<li<\/span><\/a>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>| Link 2 |<\/<\/span>a<\/span><\/a>><\/<\/span>li<\/span><\/a>><\/span><\/div><\/li>
  82. \t\t\t<li<\/span><\/a>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>| Link 3 |<\/<\/span>a<\/span><\/a>><\/<\/span>li<\/span><\/a>><\/span><\/div><\/li>
  83. \t\t\t<li<\/span><\/a>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>| Link 4 |<\/<\/span>a<\/span><\/a>><\/<\/span>li<\/span><\/a>><\/span><\/div><\/li>
  84. \t\t\t<li<\/span><\/a>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>| Link 5 |<\/<\/span>a<\/span><\/a>><\/<\/span>li<\/span><\/a>><\/span><\/div><\/li>
  85. \t\t\t<li<\/span><\/a>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>| Link 6 |<\/<\/span>a<\/span><\/a>><\/<\/span>li<\/span><\/a>><\/span><\/div><\/li>
  86. \t\t\t<li<\/span><\/a>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>| Link 7 |<\/<\/span>a<\/span><\/a>><\/<\/span>li<\/span><\/a>><\/span><\/div><\/li>
  87. \t\t\t<li<\/span><\/a>><a<\/span><\/a> href<\/span>=<\/span>"index1.html"<\/span>><\/span>| Link 8 ||<\/<\/span>a<\/span><\/a>><\/<\/span>li<\/span><\/a>><\/span><\/div><\/li>
  88. \t\t<\/<\/span>ul<\/span><\/a>><\/span><\/div><\/li>
  89. \t<\/<\/span>nav><\/span><\/div><\/li>
  90. \t<article class<\/span>=<\/span>"copyright"<\/span>><\/span> <!-- Random Copyright text --><\/span><\/div><\/li>
  91. \t\t\u00c2\u00a9 Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Proin semper, ante vitae sollicitudin posuere, metus quam iaculis nibh, vitae scelerisque nunc massa eget pede. Sed velit urna, interdum vel, ultricies vel, faucibus at, quam.<\/div><\/li>
  92. \t<\/<\/span>article><\/span><\/div><\/li>
  93. <\/<\/span>div<\/span><\/a>><\/span><\/div><\/li>
  94. <\/<\/span>body<\/span><\/a>><\/span><\/div><\/li>
  95. <\/<\/span>html<\/span><\/a>><\/span><\/div><\/li><\/ol><\/pre>","link":"https:\/\/snipplr.com\/view\/100144\/hover-menu-html"});