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();        

3 comments:

  1. I love this. It is soo informative. Are you also searching for cheap assignment writing help we are the best solution for you. We are best known for delivering the best services to students without having to break the bank

    ReplyDelete

Blogroll

Popular Posts