<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
<title>Mobiscroll</title>
<!-- jQuery Include -->
<script type="text/javascript" src="js/jquery-1.11.1.min.js" ></script>
<!-- Mobiscroll JS and CSS Includes -->
<link href="css/mobiscroll.custom-2.17.0.min.css" rel="stylesheet" type="text/css" />
<script src="js/mobiscroll.custom-2.17.0.min.js" type="text/javascript"></script>
<style type="text/css">
/* Demo Page styling, you can ignore this in your implementation */
body { padding: 0; margin: 0; font-size: 16px; font-family: arial, verdana, sans-serif; }
input, select { width: 100%; padding: .625em; margin: 0 0 .625em 0; border: 1px solid #aaa; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
.header { padding: .625em; background: #5185a8;}
.header h1 { margin: 0; padding: 0; color: #fff; text-align: center; font-size: 1.25em; font-weight: bold; text-shadow: 1px 1px 1px #000; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.content { padding: 1em; }
/* Listview demo styling */
.mbsc-lv-cont { margin: 1em -1em; }
</style>
<script>
$(function () {
function init() {
// Select demo initialization
$('#demo_select').mobiscroll().select({
theme: theme, // Specify theme like: theme: 'ios' or omit setting to use default
mode: mode, // Specify scroller mode like: mode: 'mixed' or omit setting to use default
display: display, // Specify display mode like: display: 'bottom' or omit setting to use default
lang: lang // Specify language like: lang: 'pl' or omit setting to use default
});
// Date demo initialization
$('#demo_date').mobiscroll().date({
theme: theme, // Specify theme like: theme: 'ios' or omit setting to use default
mode: mode, // Specify scroller mode like: mode: 'mixed' or omit setting to use default
display: display, // Specify display mode like: display: 'bottom' or omit setting to use default
lang: lang // Specify language like: lang: 'pl' or omit setting to use default
});
// Date & Time demo initialization
$('#demo_datetime').mobiscroll().datetime({
theme: theme, // Specify theme like: theme: 'ios' or omit setting to use default
mode: mode, // Specify scroller mode like: mode: 'mixed' or omit setting to use default
display: display, // Specify display mode like: display: 'bottom' or omit setting to use default
lang: lang, // Specify language like: lang: 'pl' or omit setting to use default
minDate: new Date(2014,3,10,9,22), // More info about minDate: http://docs.mobiscroll.com/2-17-0/datetime#!opt-minDate
maxDate: new Date(new Date().setFullYear(new Date().getFullYear() + 1)), // More info about maxDate: http://docs.mobiscroll.com/2-17-0/datetime#!opt-maxDate
stepMinute: 5 // More info about stepMinute: http://docs.mobiscroll.com/2-17-0/datetime#!opt-stepMinute
});
// Time demo initialization
$('#demo_time').mobiscroll().time({
theme: theme, // Specify theme like: theme: 'ios' or omit setting to use default
mode: mode, // Specify scroller mode like: mode: 'mixed' or omit setting to use default
display: display, // Specify display mode like: display: 'bottom' or omit setting to use default
lang: lang // Specify language like: lang: 'pl' or omit setting to use default
});
// Rating demo initialization
$('#demo_rating').mobiscroll().rating({
theme: theme, // Specify theme like: theme: 'ios' or omit setting to use default
mode: mode, // Specify scroller mode like: mode: 'mixed' or omit setting to use default
display: display, // Specify display mode like: display: 'bottom' or omit setting to use default
lang: lang, // Specify language like: lang: 'pl' or omit setting to use default
label: 'Rating' // More info about label: http://docs.mobiscroll.com/2-17-0/rating#!opt-label
});
// Rating With Text demo initialization
$('#demo_ratingtext').mobiscroll().rating({
theme: theme, // Specify theme like: theme: 'ios' or omit setting to use default
mode: mode, // Specify scroller mode like: mode: 'mixed' or omit setting to use default
display: display, // Specify display mode like: display: 'bottom' or omit setting to use default
lang: lang, // Specify language like: lang: 'pl' or omit setting to use default
label: 'Rating', // More info about label: http://docs.mobiscroll.com/2-17-0/rating#!opt-label
order: 'asc', // More info about order: http://docs.mobiscroll.com/2-17-0/rating#!opt-order
values: ['Very Bad','Bad','Ok','Good','Very Good'] // More info about values: http://docs.mobiscroll.com/2-17-0/rating#!opt-values
});
// Image & text demo initialization
$('#demo_image_text').mobiscroll().image({
theme: theme, // Specify theme like: theme: 'ios' or omit setting to use default
mode: mode, // Specify scroller mode like: mode: 'mixed' or omit setting to use default
display: display, // Specify display mode like: display: 'bottom' or omit setting to use default
lang: lang, // Specify language like: lang: 'pl' or omit setting to use default
labels: ['Cars'], // More info about labels: http://docs.mobiscroll.com/2-17-0/image#!opt-labels
enhance: true // More info about enhance: http://docs.mobiscroll.com/2-17-0/image#!opt-enhance
});
// Icon & text demo initialization
$('#demo_icon_text').mobiscroll().image({
theme: theme, // Specify theme like: theme: 'ios' or omit setting to use default
mode: mode, // Specify scroller mode like: mode: 'mixed' or omit setting to use default
display: display, // Specify display mode like: display: 'bottom' or omit setting to use default
lang: lang, // Specify language like: lang: 'pl' or omit setting to use default
enhance: true // More info about enhance: http://docs.mobiscroll.com/2-17-0/image#!opt-enhance
});
// Image demo initialization
$('#demo_image').mobiscroll().image({
theme: theme, // Specify theme like: theme: 'ios' or omit setting to use default
mode: mode, // Specify scroller mode like: mode: 'mixed' or omit setting to use default
display: display, // Specify display mode like: display: 'bottom' or omit setting to use default
lang: lang, // Spe
- 1
- 2
- 3
- 4
- 5
- 6
前往页