jqwidgets-framework
Version:
jQWidgets is an advanced Angular, Vue, Blazor, React, Web Components, jquery, ASP .NET MVC, Custom Elements and HTML5 UI framework.
37 lines (34 loc) • 2.37 kB
HTML
<html lang="en">
<head>
<meta name="keywords" content="jQuery Calendar, Month Calendar, MonthCalendar, DateTimeInput, DateTimePicker, Date Picker" />
<meta name="description" content="This demo demonstrates the jqxCalendar widget. Choose a date and navigate through the months by clicking the left or right navigation arrows.
The jqxCalendar has built-in Keyboard navigation so you can click on it and navigate by using the left, right, up or down arrow keys." />
<title id='Description'>This demo demonstrates the jqxCalendar widget. Choose a date
and navigate through the months by clicking the left or right navigation arrows.
The jqxCalendar has built-in Keyboard navigation so you can click on it and navigate
by using the left, right, up or down arrow keys. To switch to Year and Decade views, you need to click the Calendar's title. </title>
<link rel="stylesheet" href="../../../jqwidgets/styles/jqx.base.css" type="text/css" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1 maximum-scale=1 minimum-scale=1" />
<script type="text/javascript" src="../../../scripts/jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxdatetimeinput.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxcalendar.js"></script>
<script type="text/javascript" src="../../../jqwidgets/jqxtooltip.js"></script>
<script type="text/javascript" src="../../../jqwidgets/globalization/globalize.js"></script>
<script type="text/javascript" src="../../../scripts/demos.js"></script>
<script type="text/javascript">
$(document).ready(function () {
// create jqxcalendar.
$("#calendar").jqxCalendar({width: 220, height: 220});
});
</script>
</head>
<body>
<input type="date" id='calendar' />
<div style="position: absolute; bottom: 5px; right: 5px;">
<a href="https://www.jqwidgets.com/" alt="https://www.jqwidgets.com/"><img alt="https://www.jqwidgets.com/" title="https://www.jqwidgets.com/" src="https://www.jqwidgets.com/wp-content/design/i/logo-jqwidgets.png"/></a>
</div>
</body>
</html>