jQuery.monthpicker
Pick month and year with this jQuery plugin.
Usage
The plugin accepts a few options:
yearsarray of years to select fromtopOffsetdistance in pixels from the element offsetonMonthSelectevent triggered when selecting a month
Example:
$('#monthpicker').monthpicker({ years: [2015, 2014, 2013, 2012, 2011], topOffset: 6, onMonthSelect: function(m, y) { console.log('Month: ' + m + ', year: ' + y); } });See more at examples folder.
Styles
The HTML generated for the popup is shown below:
<div class="monthpicker"> <div class="years"> <select> <option>2015</option> <option>2014</option> <option>2013</option> <option>2012</option> <option>2011</option> </select> </div> <table> <tr> <td><button data-value="0">January</button></td> <td><button data-value="1">February</button></td> <td><button data-value="2">March</button></td> <td><button data-value="3">April</button></td> </tr> <tr> <td><button data-value="4">May</button></td> <td><button data-value="5">June</button></td> <td><button data-value="6">July</button></td> <td><button data-value="7">August</button></td> </tr> <tr> <td><button data-value="8">September</button></td> <td><button data-value="9">October</button></td> <td><button data-value="10">November</button></td> <td><button data-value="11">December</button></td> </tr> </table> </div>Some initial styles are added in the css/jquery.monthpicker.css file. You can change them as you please.
Tests
Run tests at test folder with QUnit.
Licence
jQuery.monthpicker is licensed under the terms of the MIT License.
