npm install hello-week --save
yarn add hello-week
<link rel="stylesheet" type="text/css" href="hello.week.min.css" />
<link rel="stylesheet" type="text/css" href="hello.week.theme.min.css" />
<script type="text/javascript" src="hello.week.min.js"></script>
<script>
new HelloWeek();
</script>
<div class="hello-week">
<div class="navigation">
<button class="prev">Prev</button>
<div class="period"></div>
<button class="next">Next</button>
</div>
<div class="week"></div>
<div class="month"></div>
</div>
HelloWeek comes with a few (optional) settings that you can change by passing an object as an argument. Default values are presented below.
new HelloWeek({
selector: '.hello-week',
lang: 'en',
langFolder: './dist/langs/',
format: 'DD/MM/YYYY',
weekShort: true,
monthShort: false,
multiplePick: false,
defaultDate: null,
todayHighlight: true,
disablePastDays: false,
disabledDaysOfWeek: null,
disableDates: null,
weekStart: 0, // week start on Sunday
daysHighlight: null,
daysSelected: null,
range: false,
rtl: false,
locked: false,
minDate: null,
maxDate: null,
nav: ['◀', '▶'],
onLoad: () => { /** callback function */ },
onChange: () => { /** callback function */ },
onSelect: () => { /** callback function */ },
onClear: () => { /** callback function */ }
});
- Chrome 49
- Firefox 31
- Opera 36
- Safari 9.3
- Edge 17
- iOS Safari 6.0
Hello Week is open-sourced software licensed under the MIT license