mirror of
https://github.com/Hopiu/jquery-mobile.git
synced 2026-03-22 17:00:24 +00:00
55 lines
No EOL
1.5 KiB
HTML
55 lines
No EOL
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>jQuery Mobile Framework - Datepicker</title>
|
|
<link rel="stylesheet" href="../../themes/default" />
|
|
<script type="text/javascript" src="../../js/"></script>
|
|
|
|
</head>
|
|
<body>
|
|
|
|
<div data-role="page">
|
|
<link rel="stylesheet" href="jquery.ui.datepicker.css" />
|
|
<script type="text/javascript" src="jQuery.ui.datepicker.js"></script>
|
|
<script type="text/javascript">
|
|
$(function(){
|
|
/* datepicker workaround */
|
|
$('input[data-type=date]').hide().after( $('<div />').datepicker() );
|
|
$('.ui-datepicker-header').addClass('ui-body-c ui-corner-top').removeClass('ui-corner-all');
|
|
$('.ui-datepicker-prev').buttonMarkup({iconpos: 'notext', icon: 'arrow-l', shadow: true, corners: true});
|
|
$('.ui-datepicker-next').buttonMarkup({iconpos: 'notext', icon: 'arrow-r', shadow: true, corners: true});
|
|
$('.ui-datepicker-calendar thead').remove();
|
|
$('.ui-datepicker-calendar .ui-btn-text span').attr('class','');
|
|
$('.ui-datepicker-calendar td').addClass('ui-btn-up-c');
|
|
$('.ui-datepicker-calendar a').buttonMarkup({corners: false, shadow: false});
|
|
/* // datepicker workaround */
|
|
});
|
|
</script>
|
|
|
|
<div data-role="header">
|
|
<h1>Datepicker Styled for mobile</h1>
|
|
|
|
</div>
|
|
|
|
<div data-role="content">
|
|
|
|
|
|
<form action="#" method="get">
|
|
|
|
<div data-role="fieldcontain">
|
|
<label for="date">Date Input (non-functional):</label>
|
|
<input type="date" name="date" id="date" value="" />
|
|
</div>
|
|
|
|
|
|
</form>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</body>
|
|
</html> |