📜 ⬆️ ⬇️

calendarLite plugin

In one of my projects I needed a simple javascript calendar. But of the existing jQuery plugins, only one “almost” met my requirements. I decided to write my own plugin - try pen calendarLite plugin .

calendarLite

Features calendarLite:For the plugin to work, as usual you need to connect the jquery and the plugin itself. Consider the main features of this plugin.


')

Setting the link format


You can set the link format (for anchor), for example for such links: http://snowcore.net/events/29–05–2009 This can be done using the linkFormat option

Possible 'linkFormat' options

  1. $ ( '#cLinkFormat' ) . calendarLite ( { linkFormat : 'http://snowcore.net/events/{%dd}-{%mm}-{%yyyy}' } ) ;
  2. $ ( '#cLinkFormat' ) . calendarLite ( { linkFormat : 'http://snowcore.net/events/{%dd}-{%mm}-{%yyyy}' } ) ;
  3. $ ( '#cLinkFormat' ) . calendarLite ( { linkFormat : 'http://snowcore.net/events/{%dd}-{%mm}-{%yyyy}' } ) ;




Setting your own callback function


To click on a cell, you can specify your handlers. Callback function accepts one value - the torn-out date. The onSelect option allows you to do this.
The additional dateFormat option allows you to set the date format that will be passed to the callback function. The default dateFormat is: '{% dd}. {% Mm}. {% Yyyy}'
  1. $ ( '#cCallback' ) . calendarLite ( {
  2. dateFormat : '{% yyyy} - {% m} - {% d}' ,
  3. onSelect : function ( date ) {
  4. alert ( date ) ;
  5. return false ;
  6. }
  7. } ) ;




Appearance customization


Using other options (and styles) you can customize the appearance of the calendar:
  1. $ ( '#cStyle' ) . calendarLite ( {
  2. showYear : true
  3. prevArrow : '& larr;' ,
  4. nextArrow : '& rarr;' ,
  5. months : [ 'January' , 'February' , 'March' , 'April' , 'May' , 'June' ,
  6. 'July' , 'August' , 'September' , 'October' , 'November' , 'December' ] ,
  7. days : [ 'Mo' , 'Tu' , 'We' , 'Th' , 'Fr' , 'Sa' , 'Su' ]
  8. } ) ;



Plugin home page: calendarLite homepage

Project page on plugins.jquery.com: calendarLite plugin

Download the plugin at Google Code: calendarLite

Source: https://habr.com/ru/post/61069/


All Articles