I have written one article on making Responsive Menu with MORE option at http://blog.sodhanalibrary.com/2014/01/responsive-menu-or-navigation-bar-with.html . Now I am adding jQuery plugin flavor. Now you can directly integrate this plugin to your menu.
Installation :
Add CSS and JS files to HTML page
<link rel="stylesheet" href="/css/jRMenuMore.css"/> <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.3.js'> </script> <script type='text/javascript' src='/js/jQuery.jRMenuMore.js'></script>
Menu or Navigation Bar - Markup :
Define your Menu in Un-Ordered List
<ul class="mymenu"> <li><a href="#">item 1</a></li> <li><a href="#">item 2</a></li> <li><a href="#">item 3</a></li> <li><a href="#">item 4</a></li> <li><a href="#">item 5</a></li> <li><a href="#">item 6</a></li> <li><a href="#">item 7</a></li> <li><a href="#">item 8</a></li> <li><a href="#">item 9</a></li> <li><a href="#">item 10</a></li> <li><a href="#">item 11</a></li> <li><a href="#">item 12</a></li> <li><a href="#">item 13</a></li> <li><a href="#">item 14</a></li> <li><a href="#">item 15</a></li> <li><a href="#">item 16</a></li> <li><a href="#">item 17</a></li> <li><a href="#">item 18</a></li> <li><a href="#">item 19</a></li> </ul>
Usage :
With Class :
$( ".mymenu" ).jRMenuMore();
With ID :
$( "#mymenu" ).jRMenuMore();
Great man, thanks
ReplyDeleteGood work
ReplyDelete