mirror of
https://github.com/Hopiu/jquery-mobile.git
synced 2026-03-20 16:00:31 +00:00
moved datepicker demo to experiments
This commit is contained in:
parent
a9c352eb59
commit
76cf9845ef
6 changed files with 56 additions and 8 deletions
|
|
@ -48,11 +48,7 @@
|
|||
<label for="password">Password Input:</label>
|
||||
<input type="password" name="password" id="password" value="" />
|
||||
</div>
|
||||
<div data-role="fieldcontain">
|
||||
<label for="date">Date Input (non-functional):</label>
|
||||
<input type="date" name="date" id="date" value="" />
|
||||
</div>
|
||||
|
||||
|
||||
<div data-role="fieldcontain">
|
||||
<label for="textarea">Textarea:</label>
|
||||
<textarea cols="40" rows="8" name="textarea" id="textarea"></textarea>
|
||||
|
|
|
|||
|
|
@ -15,8 +15,7 @@ $elements = array(
|
|||
'jQuery.mobile.forms.select.css',
|
||||
'jQuery.mobile.forms.textinput.css',
|
||||
'jQuery.mobile.listview.css',
|
||||
'jQuery.mobile.forms.slider.css',
|
||||
'jquery.ui.datepicker.css'
|
||||
'jQuery.mobile.forms.slider.css'
|
||||
);
|
||||
|
||||
?>
|
||||
|
|
|
|||
54
experiments/ui-datepicker/index.html
Normal file
54
experiments/ui-datepicker/index.html
Normal file
|
|
@ -0,0 +1,54 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>jQuery Mobile Framework - Datepicker</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../css/all" />
|
||||
<script type="text/javascript" src="../../js/all"></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div data-role="page">
|
||||
<link rel="stylesheet" type="text/css" href="jquery.ui.datepicker.css" />
|
||||
<script type="text/javascript" src="jquery.ui.datepicker.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(function(){
|
||||
/* datepicker workaround */
|
||||
$('input[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>
|
||||
<a href="index.html" class="ui-back" data-icon="arrow-l">Home</a>
|
||||
</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>
|
||||
|
|
@ -20,7 +20,6 @@ $elements = array(
|
|||
'jQuery.mobile.dialog.js',
|
||||
'jQuery.mobile.navlist.js',
|
||||
'jQuery.mobile.grid.js',
|
||||
'jQuery.ui.datepicker.js',
|
||||
'jQuery.mobile.js'
|
||||
);
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue