This time I will share jQuery Plugin and tutorial about Minimal jQuery Month Picker Plugin – Simple MonthPicker, hope it will help you in programming stack.
An easy-to-use jQuery plugin which attaches a sliding month picker or month range picker to a normal text input.
How to use it:
1. Include the required style sheet monthpicker.css in the head section of your webpage.
1 |
<link href="monthpicker.css" rel="stylesheet" type="text/css"> |
2. Create a normal text input on the webpage.
1 |
<input id="demo-1" type="text"> |
3. Include jQuery JavaScript library and the jQuery Simple MonthPicker plugin’s script at the bottom of the webpage.
1 |
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script> |
2 |
<script src="monthpicker.js"></script> |
4. The JavaScript to turn the text input to a basic month picker.
1 |
$('#demo-1').Monthpicker(); |
5. Available options to customize the month picker.
01 |
$('#demo-1').Monthpicker({ |
11 |
monthLabels: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jui", "Aug", "Sep", "Oct", "Nov", "Dec"], |
14 |
onSelect: function() { return; }, |
15 |
onClose: function() { return; } |
Change log:
2016-09-21
- Better layout detection + fix placeholder color
2016-05-04
- Better layout detection + fix placeholder color
2016-03-26
This awesome jQuery plugin is developed by VincentCharpentier. For more Advanced Usages, please check the demo page or visit the official website.
