Skip to content

Instantly share code, notes, and snippets.

@happydeveloper
Last active April 20, 2020 04:24
Show Gist options
  • Save happydeveloper/3c509549719d23dcf50a230dfa590a8d to your computer and use it in GitHub Desktop.
Save happydeveloper/3c509549719d23dcf50a230dfa590a8d to your computer and use it in GitHub Desktop.
네이버달력예제
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="https://uicdn.toast.com/tui.code-snippet/latest/tui-code-snippet.js"></script>
<script src="https://uicdn.toast.com/tui-calendar/latest/tui-calendar.js"></script>
<link rel="stylesheet" type="text/css" href="https://uicdn.toast.com/tui-calendar/latest/tui-calendar.css" />
</head>
<body>
<div id="calendar" style="width:600px;height: auto;"></div>
<script type="text/javascript">
$(document).ready(function () {
var calendar = new tui.Calendar(
document.getElementById('calendar'),
{
defaultView: 'month', taskView: true, // can be also ['milestone', 'task']
scheduleView: true, // can be also ['allday', 'time']
template: {
milestone: function (schedule) {
return '<span style="color:red;"><i class="fa fa-flag"></i> ' + schedule.title + '</span>';
}, milestoneTitle: function () {
return 'Milestone';
}, task: function (schedule) { return '&nbsp;&nbsp;#' + schedule.title; }, taskTitle: function () {
return '<label><input type="checkbox" />Task</label>';
},
allday: function (schedule) {
return schedule.title + ' <i class="fa fa-refresh"></i>';
},
alldayTitle: function () { return 'All Day'; }, time: function (schedule) {
return schedule.title + ' <i class="fa fa-refresh"></i>' + schedule.start;
}
}, month: {
daynames: ['일요일', '월요일', '화요일', '수요일', '목요일', '금요일', '토요일'],
startDayOfWeek: 0, narrowWeekend: true
},
week: { daynames: ['일요일', '월요일', '화요일', '수요일', '목요일', '금요일', '토요일'], startDayOfWeek: 0, narrowWeekend: true }
}); calendar.createSchedules([{
id: '1', calendarId: '1', title: 'KT 5 프로젝트 날',
category: 'time', dueDateClass: '',
start: '2020-04-20T09:00:00+09:00', end: '2020-04-20T18:00:00+09:00',
isReadOnly: true // schedule is read-only
},
{
id: '2', calendarId: '2', title: 'KT 데이타분석',
category: 'time', dueDateClass: '',
start: '2020-04-14T13:30:00+09:000', end: '2020-04-15T12:30:00+09:00'
},
{
id: '3', calendarId: '3', title: '웹크롤링',
category: 'time', dueDateClass: '',
start: '2020-04-25T13:30:00+09:00', end: '2020-04-25T18:30:00+09:00'
}]);
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment