Choose Demo
Date & Time Calendar Range Select Numpad Color Listview Rating Image & Text Treelist Distance Speed Temperature Mass Force Timespan Timer Number Demo Apps
Mobiscroll
iOS7
iOS
Android Holo
Android Holo Light
jQuery Mobile 1.4
jQuery Mobile 1.3
Android
Bootstrap
Windows Phone
Windows Phone Light
Sense UI
Sense 5
Inline
Modal
Bubble
Top
Bottom
English
Cestina
Chinese
Deutsch
English (UK)
Español
Français
Italiano
Japanese
Magyar
Nederlands
Norsk
Polski
Português Europeu
Pt. Brasileiro
Româna
Slovencina
Svenska
Türkçe
Русский
Русский (UA)
فارسی
No Device
iPhone
Android
Windows Phone
Blackberry
iPad Mini
Try now RISK-FREE for 30 days
Calendar / With time scroller
See what makes this demo awesome
Highlights
Calendar and Time scroller
Smart-Layout
Easy Date & Time picking
What to do
Try Tapping the Calendar / Time tabs
Set a Date and a Time
Try Loading the "iPad Mini" emulator
Try it on your phone at msc.li/0ojc

HTML

Copy to Clipboard
<input id="demo" placeholder="Please Select ..." />

<button id="clear">Clear</button>
<button id="show">Show</button>

Javascript

Copy to Clipboard
$(function(){
    $('#demo').mobiscroll().calendar({
        controls: ['calendar', 'time'],
        theme: 'default',
        accent: ' ',
        lang: ' ',
        display: 'inline',
        animate: ' ',
        mode: 'mixed'
    });    
    $('#show').click(function(){
        $('#demo').mobiscroll('show'); 
        return false;
    });
    $('#clear').click(function () {
        $('#demo').val('');
        return false;
    });
});