<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<meta name="description" content="A multi-page template generated by Tizen Web IDE"/>
<title>Tizen Web IDE - Tizen - jQuery Mobile - Mutil-Page</title>
<link rel="stylesheet" href="./css/jquery.mobile-1.1.0.css"/>
<link rel='stylesheet' type='text/css' href='css/fullcalendar.css' />
<link rel='stylesheet' type='text/css' href='css/fullcalendar.print.css' media='print' />
<script type="text/javascript" src="./js/jquery-1.7.1.js"></script>
<script type="text/javascript" src="./js/jquery.mobile-1.1.0.js"></script>
<script type='text/javascript' src='js/jquery-ui-1.8.23.custom.min.js'></script>
<script type="text/javascript" src="./js/main.js"></script>
<script type='text/javascript' src='js/fullcalendar.min.js'></script>
<script src="js/jquery.ui.touch-punch.min.js"></script>
<link rel="stylesheet" href="css/style.css" />
<script type='text/javascript'>
$(document).ready(function() {
var date = new Date();
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
$('#calendar').fullCalendar({
theme: false,
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
editable: true,
});
$('#calendar').bind('swipeleft', function(event) {
$('#calendar').fullCalendar('next');
});
$('#calendar').bind('swiperight', function(event) {
$('#calendar').fullCalendar('prev');
});
});
</script>
</head>
<body>
<div data-role="page" >
<div data-role="header">
<h1>Calendar</h1>
</div><!-- /header -->
<div data-role="content" id='calendar' data-theme="a">
</div><!-- /content -->
<div data-role="footer" id="foot" data-position="fixed">
<div data-role="navbar">
<ul>
<li><a href="#A">A</a></li>
<li><a href="#popup" >B</a></li>
<li><a href="#" onclick="dothis1();">C</a></li>
</ul>
</div>
</div>
</div><!-- /page -->
</body>
</html>