<!--时间选择css+js--> <link href="js/datatime/mobiscroll.css" rel="stylesheet" type="text/css"> <link href="js/datatime/mobiscroll_002.css" rel="stylesheet" type="text/css"> <link href="js/datatime/mobiscroll_003.css" rel="stylesheet" type="text/css"> <script src="js/datatime/mobiscroll_002.js" type="text/javascript"></script> <script src="js/datatime/mobiscroll_004.js" type="text/javascript"></script> <script src="js/datatime/mobiscroll.js" type="text/javascript"></script> <script src="js/datatime/mobiscroll_003.js" type="text/javascript"></script> <script src="js/datatime/mobiscroll_005.js" type="text/javascript"></script>
.dw-trans .dw-persp {
overflow: hidden;
perspective: 1000;
-webkit-perspective: 1000;
-moz-perspective: 1000;
}
.dw-trans .dwwb {
-webkit-backface-visibility: hidden;
}
.dw-in {
animation-timing-function: ease-out;
animation-duration: 350ms;
-webkit-animation-timing-function: ease-out;
-webkit-animation-duration: 350ms;
-moz-animation-timing-function: ease-out;
-moz-animation-duration: 350ms;
}
.dw-out {
animation-timing-function: ease-in;
animation-duration: 350ms;
-webkit-animation-timing-function: ease-in;
-webkit-animation-duration: 350ms;
-moz-animation-timing-function: ease-in;
-moz-animation-duration: 350ms;
}
.dw-flip,
.dw-swing,
.dw-slidehorizontal,
.dw-slidevertical,
.dw-slidedown,
.dw-slideup,
.dw-fade {
backface-visibility: hidden;
transform: translateX(0);
-webkit-backface-visibility: hidden;
-webkit-transform: translateX(0);
-moz-backface-visibility: hidden;
-moz-transform: translateX(0);
}
.dw-swing,
.dw-slidehorizontal,
.dw-slidevertical,
.dw-slidedown,
.dw-slideup,
.dw-fade {
transform-origin: 0 0;
-webkit-transform-origin: 0 0;
-moz-transform-origin: 0 0;
}
.dw-flip,
.dw-pop {
transform-origin: 50% 50%;
-webkit-transform-origin: 50% 50%;
-moz-transform-origin: 50% 50%;
}
.dw-pop.dw-in {
opacity: 1;
transform: scale(1);
animation-name: dw-p-in;
-webkit-animation-name: dw-p-in;
-webkit-transform: scale(1);
-moz-animation-name: dw-p-in;
-moz-transform: scale(1);
}
.dw-pop.dw-out {
opacity: 0;
animation-name: dw-p-out;
-webkit-animation-name: dw-p-out;
-moz-animation-name: dw-p-out;
}
.dw-flip.dw-in {
opacity: 1;
transform: scale(1);
animation-name: dw-fl-in;
-webkit-animation-name: dw-fl-in;
-webkit-transform: scale(1);
-moz-animation-name: dw-fl-in;
-moz-transform: scale(1);
}
.dw-flip.dw-out {
opacity: 0;
animation-name: dw-fl-out;
-webkit-animation-name: dw-fl-out;
-moz-animation-name: dw-fl-out;
}
.dw-swing.dw-in {
opacity: 1;
transform: scale(1);
animation-name: dw-sw-in;
-webkit-animation-name: dw-sw-in;
-webkit-transform: scale(1);
-moz-animation-name: dw-sw-in;
-moz-transform: scale(1);
}
.dw-swing.dw-out {
opacity: 0;
animation-name: dw-sw-out;
-webkit-animation-name: dw-sw-out;
-moz-animation-name: dw-sw-out;
}
.dw-slidehorizontal.dw-in {
opacity: 1;
transform: scale(1);
animation-name: dw-sh-in;
-webkit-animation-name: dw-sh-in;
-webkit-transform: scale(1);
-moz-animation-name: dw-sh-in;
-moz-transform: scale(1);
}
.dw-slidehorizontal.dw-out {
opacity: 0;
animation-name: dw-sh-out;
-webkit-animation-name: dw-sh-out;
-moz-animation-name: dw-sh-out;
}
.dw-slidevertical.dw-in {
opacity: 1;
animation-name: dw-dw-sv-in;
transform: scale(1);
-webkit-animation-name: dw-dw-sv-in;
-webkit-transform: scale(1);
-moz-animation-name: dw-dw-sv-in;
-moz-transform: scale(1);
}
.dw-slidevertical.dw-out {
opacity: 0;
animation-name: dw-sv-out;
-webkit-animation-name: dw-sv-out;
-moz-animation-name: dw-sv-out;
}
.dw-slidedown.dw-in {
animation-name: dw-sd-in;
transform: scale(1);
-webkit-animation-name: dw-sd-in;
-webkit-transform: scale(1);
-moz-animation-name: dw-sd-in;
-moz-transform: scale(1);
}
.dw-slidedown.dw-out {
animation-name: dw-sd-out;
-webkit-animation-name: dw-sd-out;
-moz-animation-name: dw-sd-out;
}
.dw-slideup.dw-in {
transform: scale(1);
animation-name: dw-su-in;
-webkit-animation-name: dw-su-in;
-webkit-transform: scale(1);
-moz-animation-name: dw-su-in;
-moz-transform: scale(1);
}
.dw-slideup.dw-out {
animation-name: dw-su-out;
-webkit-animation-name: dw-su-out;
-moz-animation-name: dw-su-out;
}
.dw-fade.dw-in {
opacity: 1;
animation-name: dw-f-in;
-webkit-animation-name: dw-f-in;
-moz-animation-name: dw-f-in;
}
.dw-fade.dw-out {
opacity: 0;
animation-name: dw-f-out;
-webkit-animation-name: dw-f-out;
-moz-animation-name: dw-f-out;
}
/* Fade in */
@keyframes dw-f-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes dw-f-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-moz-keyframes dw-f-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
/* Fade out */
@keyframes dw-f-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-webkit-keyframes dw-f-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@-moz-keyframes dw-f-out {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
/* Pop in */
@keyframes dw-p-in {
from {
opacity: 0;
transform: scale(0.8);
}
to {
opacity: 1;
transform: scale(1);
}
}
@-webkit-keyframes dw-p-in {
from {
opacity: 0;
-webkit-transform: scale(0.8);
}
to {
opacity: 1;
-webkit-transform: scale(1);
}
}
@-moz-keyframes dw-p-in {
from {
opacity: 0;
-moz-transform: scale(0.8);
}
to {
opacity: 1;
-moz-transform: scale(1);
}
}
/* Pop out */
@keyframes dw-p-out {
from {
opacity: 1;
transform: scale(1);
}
to {
opacity: 0;
transform: scale(0.8);
}
}
@-webkit-keyframes dw-p-out {
from {
opacity: 1;
-webkit-transform: scale(1);
}
to {
opacity: 0;
-webkit-transform: scale(0.8);
}
}
@-moz-keyframes dw-p-out {
from {
opacity: 1;
-moz-transform: scale(1);
}
to {
opacity: 0;
-moz-transform: scale(0.8);
}
}
/* Flip in */
@keyframes dw-fl-in {
from {
opacity: 0;
transform: rotateY(90deg);
}
to {
opacity: 1;
transform: rotateY(0);
}
}
@-webkit-keyframes dw-fl-in {
from {
opacity: 0;
-webkit-transform: rotateY(90deg);
}
to {
opacity: 1;
-webkit-transform: rotateY(0);
}
}
@-moz-keyframes dw-fl-in {
from {
opacity: 0;
-moz-transform: rotateY(90deg);
}
to {
opacity: 1;
-moz-transform: rotateY(0);
}
}
/* Flip out */
@keyframes dw-fl-out {
from {
opacity: 1;
transform: rotateY(0deg);
}
to {
opacity: 0;
transform: rotateY(-90deg);
}
}
@-webkit-keyframes dw-fl-out {
from {
opacity: 1;
-webkit-transform: rotateY(0deg);
}
to {
opacity: 0;
-webkit-transform: rotateY(-90deg);
}
}
@-moz-keyframes dw-fl-out {
from {
opacity: 1;
-moz-transform: rotateY(0deg);
}
to {
opacity: 0;
-moz-transform: rotateY(-90deg);
}
}
/* Swing in */
@keyframes dw-sw-in {
from {
opacity: 0;
transform: rotateY(-90deg);
}
to {
opacity: 1;
transform: rotateY(0deg);
}
}
@-webkit-keyframes dw-sw-in {
from {
opacity: 0;
-webkit-transform: rotateY(-90deg);
}
to {
opacity: 1;
-webkit-transform: rotateY(0deg);
}
}
@-moz-keyframes dw-sw-in {
from {
opacity: 0;
-moz-transform: rotateY(-90deg);
}
to {
opacity: 1;
-moz-transform: rotateY(0deg);
}
}
/* Swing out */
@keyframes dw-sw-out {
from {
opacity: 1;
transform: rotateY(0deg);
}
to {
opacity: 0;
transform: rotateY(-90deg);
}
}
@-webkit-keyframes dw-sw-out {
from {
opacity: 1;
-webkit-transform: rotateY(0deg);
}
to {
opacity: 0;
-webkit-transform: rotateY(-90deg);
}
}
@-moz-keyframes dw-sw-out {
from {
opacity: 1;
-moz-transform: rotateY(0deg);
}
to {
opacity: 0;
-moz-transform: rotateY(-90deg);
}
}
/* Slide horizontal in */
@keyframes dw-sh-in {
from {
opacity: 0;
transform: translateX(-100%);
}
to {
opacity: 1;
transform: translateX(0);
}
}
@-webkit-keyframes dw-sh-in {
from {
opacity: 0;
-webkit-transform: translateX(-100%);
}
to {
opacity: 1;
-webkit-transform: translateX(0);
}
}
@-moz-keyframes dw-sh-in {
from {
opacity: 0;
-moz-transform: translateX(-100%);
}
to {
opacity: 1;
-moz-transform: translateX(0);
}
}
/* Slide horizontal out */
@keyframes dw-sh-out {
from {
opacity: 1;
transform: translateX(0);
}
to {
opacity: 0;
transform: translateX(100%);
}
}
@-webkit-keyframes dw-sh-out {
from {
opacity: 1;
-webkit-transform: translateX(0);
}
to {
opacity: 0;
-webkit-transform: translateX(100%);
}
}
@-moz-keyframes dw-sh-out {
from {
opacity: 1;
-moz-transform: translateX(0);
}
to {
opacity: 0;
-moz-transform: translateX(100%);
}
}
/* Slide vertical in */
@keyframes dw-dw-sv-in {
from {
opacity: 0;
transform: translateY(-100%);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@-webkit-keyframes dw-dw-sv-in {
from {
opacity: 0;
-webkit-transform: translateY(-100%);
}
to {
opacity: 1;
-webkit-transform: translateY(0);
}
}
@-moz-keyframes dw-dw-sv-in {
from {
opacity: 0;
-moz-transform: translateY(-100%);
}
to {
opacity: 1;
-moz-transform: translateY(0);
}
}
/* Slide vertical out */
@keyframes dw-sv-out {
from {
opacity: 1;
transform: translateY(0);
}
to {
opacity: 0;
transform: translateY(100%);
}
}
@-webkit-keyframes dw-sv-out {
from {
opacity: 1;
-webkit-transform: translateY(0);
}
to {
opacity: 0;
-webkit-transform: translateY(100%);
}
}
@-moz-keyframes dw-sv-out {
from {
opacity: 1;
-moz-transform: translateY(0);
}
to {
opacity: 0;
-moz-transform: translateY(100%);
}
}
/* Slide Down In */
@keyframes dw-sd-in {
from {
transform: translateY(-100%);
}
to {
transform: translateY(0);
}
}
@-webkit-keyframes dw-sd-in {
from {
opacity: 1;
-webkit-transform: translateY(-100%);
}
to {
opacity: 1;
-webkit-transform: translateY(0);
}
}
@-moz-keyframes dw-sd-in {
from {
-moz-transform: translateY(-100%);
}
to {
-moz-transform: translateY(0);
}
}
/* Slide down out */
@keyframes dw-sd-out {
from {
transform: translateY(0);
}
to {
transform: translateY(-100%);
}
}
@-webkit-keyframes dw-sd-out {
from {
opacity: 1;
-webkit-transform: translateY(0);
}
to {
opacity: 1;
-webkit-transform: translateY(-100%);
}
}
@-moz-keyframes dw-sd-out {
from {
-moz-transform: translateY(0);
}
to {
-moz-transform: translateY(-100%);
}
}
/* Slide Up In */
@keyframes dw-su-in {
from {
transform: translateY(100%);
}
to {
transform: translateY(0);
}
}
@-webkit-keyframes dw-su-in {
from {
opacity: 1;
-webkit-transform: translateY(100%);
}
to {
opacity: 1;
-webkit-transform: translateY(0);
}
}
@-moz-keyframes dw-su-in {
from {
-moz-transform: translateY(100%);
}
to {
-moz-transform: translateY(0);
}
}
/* Slide up out */
@keyframes dw-su-out {
from {
transform: translateY(0);
}
to {
transform: translateY(100%);
}
}
@-webkit-keyframes dw-su-out {
from {
opacity: 1;
-webkit-transform: translateY(0);
}
to {
opacity: 1;
-webkit-transform: translateY(100%);
}
}
@-moz-keyframes dw-su-out {
from {
-moz-transform: translateY(0);
}
to {
-moz-transform: translateY(100%);
}
}
mobiscroll.css
/* Datewheel overlay */
.dw {
position: absolute;
top: 5%;
left: 0;
z-index: 1001;
color: #000;
font-family: arial, verdana, sans-serif;
font-size: 12px;
text-shadow: none;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-ms-touch-action: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.dwi {
position: static;
margin: 5px;
display: inline-block;
}
.dwwr {
min-width: 170px;
zoom: 1;
padding: 0 10px;
text-align: center;
}
/* Datewheel overlay background */
.dw-persp, .dwo {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 1001;
}
.dwo {
background: #000;
opacity: .7;
filter: Alpha(Opacity=70);
}
/* Bubble positionings */
.dw-bubble .dw {
margin: 20px 0;
}
.dw-bubble .dw-arrw {
position: absolute;
left: 0;
width: 100%;
}
.dw-bubble-top .dw-arrw {
bottom: -36px;
}
.dw-bubble-bottom .dw-arrw {
top: -36px;
}
.dw-bubble .dw-arrw-i {
margin: 0 30px;
position: relative;
height: 36px;
}
.dw-bubble .dw-arr {
display: block;
}
.dw-arr {
display: none;
position: absolute;
left: 0;
width: 0;
height: 0;
border-width: 18px 18px;
border-style: solid;
margin-left: -18px;
}
.dw-bubble-bottom .dw-arr {
top: 0;
border-color: transparent transparent #fff transparent;
}
.dw-bubble-top .dw-arr {
bottom: 0;
border-color: #fff transparent transparent transparent;
}
/* Datewheel wheel container wrapper */
.dwc {
float: none;
margin: 0 2px 5px 2px;
padding-top: 30px;
display: inline-block;
}
.dwcc {
clear: both;
}
/* Datewheel label */
.dwl {
text-align: center;
line-height: 30px;
height: 30px;
white-space: nowrap;
position: absolute;
top: -30px;
width: 100%;
}
/* Datewheel value */
.dwv {
padding: 10px 0;
border-bottom: 1px solid #000;
}
/* Datewheel wheel container */
.dwrc {
-webkit-border-radius: 3px;
border-radius: 3px;
}
.dwwc {
margin: 0;
padding: 0 2px;
position: relative;
background: #000;
zoom: 1;
}
/* Datewheel wheels */
.dwwl {
margin: 4px 2px;
position: relative;
z-index: 5;
}
.dww {
margin: 0 2px;
overflow: hidden;
position: relative;
}
.dwsc .dwwl {
background: #888;
background: linear-gradient(#000 0%,#333 35%, #888 50%,#333 65%,#000 100%);
background: -webkit-gradient(linear,left bottom,left top,from(#000),color-stop(0.35, #333),color-stop(0.50, #888),color-stop(0.65, #333),to(#000));
background: -moz-linear-gradient(#000 0%,#333 35%, #888 50%,#333 65%,#000 100%);
background: -o-linear-gradient(#000 0%,#333 35%, #888 50%,#333 65%,#000 100%);
}
.dwsc .dww {
color: #fff;
background: #444;
background: linear-gradient(#000 0%,#444 45%, #444 55%, #000 100%);
background: -webkit-gradient(linear,left bottom,left top,from(#000),color-stop(0.45, #444),color-stop(0.55, #444),to(#000));
background: -moz-linear-gradient(#000 0%,#444 45%, #444 55%, #000 100%);
background: -o-linear-gradient(#000 0%,#444 45%, #444 55%, #000 100%);
}
.dw-bf {
-webkit-perspective: 1000;
-webkit-backface-visibility: hidden;
}
.dw-ul {
position: relative;
z-index: 2;
}
.dw-li {
padding: 0 5px;
display: block;
text-align: center;
line-height: 40px;
font-size: 26px;
white-space: nowrap;
text-shadow: 0 1px 1px #000;
vertical-align: bottom;
opacity: .3;
filter: Alpha(Opacity=30);
}
/* Higlighted */
.dw-li.dw-hl {
background: #fff;
background: rgba(255,255,255,.3);
}
/* Valid entry */
.dw-li.dw-v {
opacity: 1;
filter: Alpha(Opacity=100);
}
/* Hidden entry */
.dw-li.dw-h {
visibility: hidden;
}
.dw-i {
position: relative;
height: 100%;
}
/* Wheel +/- buttons */
.dwwb {
position: absolute;
z-index: 4;
left: 0;
cursor: pointer;
width: 100%;
height: 40px;
text-align: center;
opacity: 1;
transition: opacity .2s linear;
-webkit-transition: opacity .2s linear;
}
.dwa .dwwb {
opacity: 0;
}
.dwwbp {
top: 0;
-webkit-border-radius: 3px 3px 0 0;
border-radius: 3px 3px 0 0;
font-size: 40px;
}
.dwwbm {
bottom: 0;
-webkit-border-radius: 0 0 3px 3px;
border-radius: 0 0 3px 3px;
font-size: 32px;
font-weight: bold;
}
.dwpm .dwwc {
background: transparent;
}
.dwpm .dww {
margin: 0;
}
.dwpm .dw-li {
text-shadow: none;
}
.dwpm .dwwol {
display: none;
}
/* Datewheel wheel overlay */
.dwwo {
position: absolute;
z-index: 3;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(#000 0%,rgba(44,44,44,0) 52%, rgba(44,44,44,0) 48%, #000 100%);
background: -webkit-gradient(linear,left bottom,left top,from(#000),color-stop(0.52, rgba(44,44,44,0)),color-stop(0.48, rgba(44,44,44,0)),to(#000));
background: -moz-linear-gradient(#000 0%,rgba(44,44,44,0) 52%, rgba(44,44,44,0) 48%, #000 100%);
background: -o-linear-gradient(#000 0%,rgba(44,44,44,0) 52%, rgba(44,44,44,0) 48%, #000 100%);
}
/* Background line */
.dwwol {
position: absolute;
z-index: 1;
top: 50%;
left: 0;
width: 100%;
height: 0;
margin-top: -1px;
border-top: 1px solid #333;
border-bottom: 1px solid #555;
}
/* Datewheel button */
.dwbg .dwb {
cursor: pointer;
overflow: hidden;
display: block;
height: 40px;
line-height: 40px;
padding: 0 15px;
margin: 0 2px;
font-size: 14px;
font-weight: bold;
text-decoration: none;
text-shadow: 0 -1px 1px #000;
border-radius: 5px;
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
color: #fff;
background: #000;
background: linear-gradient(#6e6e6e 50%,#000 50%);
background: -webkit-gradient(linear,left bottom,left top,color-stop(0.5, #000),color-stop(0.5, #6e6e6e));
background: -moz-linear-gradient(#6e6e6e 50%,#000 50%);
background: -o-linear-gradient(#6e6e6e 50%,#000 50%);
white-space: nowrap;
text-overflow: ellipsis;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-border-radius: 5px;
}
/* Datewheel button container */
.dwbc {
padding: 5px 0;
text-align: center;
clear: both;
}
.dwbc:after {
content: ‘‘;
display: block;
clear: both;
}
/* Datewheel button wrapper */
.dwbw {
display: inline-block;
float: left;
width: 50%;
position: relative;
z-index: 5;
}
.dwbc-p .dwbw {
width: 33.33%;
}
/* Hidden label */
.dwhl {
padding-top: 10px;
}
.dwhl .dwl {
display: none;
}
/* Multiple selection */
.dwms .dwwms .dw-li {
padding: 0 40px;
position: relative;
}
.dwms .dw-msel:after {
width: 40px;
text-align: center;
position: absolute;
top: 0;
left: 0;
content: ‘?‘;
}
/* Backgrounds */
.dwbg {
background: #fff;
border-radius: 3px;
-webkit-border-radius: 3px;
}
.dwbg .dwpm .dwwl {
border: 1px solid #aaa;
}
.dwbg .dwpm .dww {
color: #000;
background: #fff;
-webkit-border-radius: 3px;
}
.dwbg .dwwb {
background: #ccc;
color: #888;
text-shadow: 0 -1px 1px #333;
box-shadow: 0 0 5px #333;
-webkit-box-shadow: 0 0 5px #333;
}
.dwbg .dwwbp {
background: linear-gradient(#f7f7f7,#bdbdbd);
background: -webkit-gradient(linear,left bottom,left top,from(#bdbdbd),to(#f7f7f7));
background: -moz-linear-gradient(#f7f7f7,#bdbdbd);
background: -o-linear-gradient(#f7f7f7,#bdbdbd);
}
.dwbg .dwwbm {
background: linear-gradient(#bdbdbd,#f7f7f7);
background: -webkit-gradient(linear,left bottom,left top,from(#f7f7f7),to(#bdbdbd));
background: -moz-linear-gradient(#bdbdbd,#f7f7f7);
background: -o-linear-gradient(#bdbdbd,#f7f7f7);
}
.dwbg .dwb-a {
background: #3c7500;
background: linear-gradient(#94c840 50%,#3c7500 50%);
background: -webkit-gradient(linear,left bottom,left top,color-stop(0.5, #3c7500),color-stop(0.5, #94c840));
background: -moz-linear-gradient(#94c840 50%,#3c7500 50%);
background: -o-linear-gradient(#94c840 50%,#3c7500 50%);
}
.dwbg .dwwl .dwb-a {
background: #3c7500;
background: linear-gradient(#94c840,#3c7500);
background: -webkit-gradient(linear,left bottom,left top,from(#3c7500),to(#94c840));
background: -moz-linear-gradient(#94c840,#3c7500);
background: -o-linear-gradient(#94c840,#3c7500);
}
mobiscroll_002.css
/* Android ICS skin */
.android-ics .dw {
padding: 0;
color: #43AD0F;
background: #292829;
}
.android-ics .dw .dwwc,
.android-ics .dw .dwwl,
.android-ics .dw .dww,
.android-ics .dw .dwb,
.android-ics .dw .dwpm .dww {
background: none;
}
.android-ics .dwwr {
padding: 0;
}
.android-ics .dwc {
margin: 0;
padding: 30px 10px 1px 10px;
}
.android-ics .dwhl {
padding: 1px 10px;
}
.android-ics .dwv {
height: 36px;
line-height: 36px;
padding: 0;
border-bottom: 2px solid #43AD0F;
font-size: 18px;
}
.android-ics .dwwl {
margin: 0 2px;
}
.android-ics .dww,
.android-ics .dw .dwpm .dwwl,
.android-ics .dw .dwpm .dww {
border: 0;
}
.android-ics .dww .dw-li {
color: #fff;
font-size: 18px;
text-shadow: none;
}
.android-ics .dww .dw-li.dw-hl {
background: #31b6e7;
background: rgba(49,182,231,.5);
}
.android-ics .dwwo {
background: linear-gradient(#282828 0%,rgba(40,40,40,0) 52%, rgba(40,40,40,0) 48%, #282828 100%);
background: -webkit-gradient(linear,left bottom,left top,from(#282828),color-stop(0.52, rgba(40,40,40,0)),color-stop(0.48, rgba(40,40,40,0)),to(#282828));
background: -moz-linear-gradient(#282828 0%,rgba(40,40,40,0) 52%, rgba(40,40,40,0) 48%, #282828 100%);
background: -o-linear-gradient(#282828 0%,rgba(40,40,40,0) 52%, rgba(40,40,40,0) 48%, #282828 100%);
}
.android-ics .dw .dwwb {
background: #292829;
box-shadow: none;
-webkit-box-shadow: none;
}
.android-ics .dwwb span {
display: none;
}
.android-ics .dwwb:after {
position: absolute;
top: 50%;
left: 50%;
margin-top: -8px;
margin-left: -8px;
color: #7e7e7e;
width: 0;
height: 0;
border-width: 8px;
border-style: solid;
content: ‘‘;
}
.android-ics .dwwbm {
top: 0;
bottom: auto;
}
.android-ics .dwwbp {
bottom: 0;
top: auto;
}
.android-ics .dwwbm:after {
border-color: transparent transparent #7e7e7e transparent;
}
.android-ics .dwwbp:after {
border-color: #7e7e7e transparent transparent transparent;
}
.android-ics .dw .dwwl .dwb-a {
background: #292829;
}
.android-ics .dwwbm.dwb-a:after {
border-color: transparent transparent #319abd transparent;
}
.android-ics .dwwbp.dwb-a:after {
border-color: #319abd transparent transparent transparent;
}
.android-ics .dw .dwwol {
width: 60%;
left: 20%;
height: 36px;
border-top: 2px solid #43AD0F;
border-bottom: 2px solid #43AD0F;
margin-top: -20px;
display: block;
}
.android-ics .dwbc {
border-top: 1px solid #424542;
padding: 0;
}
.android-ics .dw .dwb {
height: 36px;
line-height: 36px;
padding: 0;
margin: 0;
font-weight: normal;
text-shadow: none;
box-shadow: none;
border-radius: 0;
-webkit-border-radius: 0;
-webkit-box-shadow: none;
}
.android-ics .dw .dwb-a {
background: #35840D;
}
.android-ics .dwb-s .dwb, .android-ics .dwb-n .dwb {
border-right: 1px solid #424542;
}
/* Docked */
.android-ics.dw-bottom .dw, .android-ics.dw-top .dw {
border-radius: 0;
-webkit-border-radius: 0;
}
/* Multiple select */
.android-ics .dwwms .dwwol {
display: none;
}
.android-ics .dwwms .dw-li {
padding-left: 5px;
padding-right: 36px;
}
.android-ics .dwwms .dw-li:after {
content: ‘‘;
position: absolute;
top: 50%;
left: auto;
right: 10px;
width: 14px;
height: 14px;
margin-top: -9px;
color: #31b6e7;
line-height: 14px;
border: 1px solid #424542;
text-shadow: 0 0 5px #29799c;
}
.android-ics .dwwms .dw-msel:after {
content: ‘?‘;
}
/* Light version */
.android-ics.light .dw {
background: #f5f5f5;
}
.android-ics.light .dww .dw-li {
color: #000;
}
.android-ics.light .dwwo {
background: linear-gradient(#f5f5f5 0%,rgba(245,245,245,0) 52%, rgba(245,245,245,0) 48%, #f5f5f5 100%);
background: -webkit-gradient(linear,left bottom,left top,from(#f5f5f5),color-stop(0.52, rgba(245,245,245,0)),color-stop(0.48, rgba(245,245,245,0)),to(#f5f5f5));
background: -moz-linear-gradient(#f5f5f5 0%,rgba(245,245,245,0) 52%, rgba(245,245,245,0) 48%, #f5f5f5 100%);
background: -o-linear-gradient(#f5f5f5 0%,rgba(245,245,245,0) 52%, rgba(245,245,245,0) 48%, #f5f5f5 100%);
}
.android-ics.light .dw .dwwb {
background: #f5f5f5;
color: #f5f5f5;
}
.android-ics.light .dwbc {
border-top: 1px solid #dbdbdb;
}
.android-ics.light .dwb {
color: #000;
}
.android-ics.light .dwb-a {
color: #fff;
}
.android-ics.light .dwb-s .dwb, .android-ics.light .dwb-n .dwb {
border-right: 1px solid #dbdbdb;
}
/* Bubble positioning */
.android-ics .dw-bubble-bottom .dw-arr {
border-color: transparent transparent #292829 transparent;
}
.android-ics .dw-bubble-top .dw-arr {
border-color: #292829 transparent transparent transparent;
}
/* Bubble positioning */
.android-ics.light .dw-bubble-bottom .dw-arr {
border-color: transparent transparent #f5f5f5 transparent;
}
.android-ics.light .dw-bubble-top .dw-arr {
border-color: #f5f5f5 transparent transparent transparent;
}
/* Multiple select */
.android-ics.light .dwwms .dw-li:after {
text-shadow: 0 0 5px #31b6e7;
}
mobiscroll_003.css
/*jslint eqeq: true, plusplus: true, undef: true, sloppy: true, vars: true, forin: true */
/*!
* jQuery MobiScroll v2.5.1
* http://mobiscroll.com
*
* Copyright 2010-2013, Acid Media
* Licensed under the MIT license.
*
*/
(function ($) {
function Scroller(elem, settings) {
var m,
hi,
v,
dw,
ww, // Window width
wh, // Window height
rwh,
mw, // Modal width
mh, // Modal height
anim,
debounce,
that = this,
ms = $.mobiscroll,
e = elem,
elm = $(e),
theme,
lang,
s = extend({}, defaults),
pres = {},
warr = [],
iv = {},
pixels = {},
input = elm.is(‘input‘),
visible = false;
// Private functions
function isReadOnly(wh) {
if ($.isArray(s.readonly)) {
var i = $(‘.dwwl‘, dw).index(wh);
return s.readonly[i];
}
return s.readonly;
}
function generateWheelItems(i) {
var html = ‘<div class="dw-bf">‘,
l = 1,
j;
for (j in warr[i]) {
if (l % 20 == 0) {
html += ‘</div><div class="dw-bf">‘;
}
html += ‘<div class="dw-li dw-v" data-val="‘ + j + ‘" style="height:‘ + hi + ‘px;line-height:‘ + hi + ‘px;"><div class="dw-i">‘ + warr[i][j] + ‘</div></div>‘;
l++;
}
html += ‘</div>‘;
return html;
}
function setGlobals(t) {
min = $(‘.dw-li‘, t).index($(‘.dw-v‘, t).eq(0));
max = $(‘.dw-li‘, t).index($(‘.dw-v‘, t).eq(-1));
index = $(‘.dw-ul‘, dw).index(t);
h = hi;
inst = that;
}
function formatHeader(v) {
var t = s.headerText;
return t ? (typeof t === ‘function‘ ? t.call(e, v) : t.replace(/\{value\}/i, v)) : ‘‘;
}
function read() {
that.temp = ((input && that.val !== null && that.val != elm.val()) || that.values === null) ? s.parseValue(elm.val() || ‘‘, that) : that.values.slice(0);
that.setValue(true);
}
function scrollToPos(time, index, manual, dir, orig) {
// Call validation event
if (event(‘validate‘, [dw, index, time]) !== false) {
// Set scrollers to position
$(‘.dw-ul‘, dw).each(function (i) {
var t = $(this),
cell = $(‘.dw-li[data-val="‘ + that.temp[i] + ‘"]‘, t),
cells = $(‘.dw-li‘, t),
v = cells.index(cell),
l = cells.length,
sc = i == index || index === undefined;
// Scroll to a valid cell
if (!cell.hasClass(‘dw-v‘)) {
var cell1 = cell,
cell2 = cell,
dist1 = 0,
dist2 = 0;
while (v - dist1 >= 0 && !cell1.hasClass(‘dw-v‘)) {
dist1++;
cell1 = cells.eq(v - dist1);
}
while (v + dist2 < l && !cell2.hasClass(‘dw-v‘)) {
dist2++;
cell2 = cells.eq(v + dist2);
}
// If we have direction (+/- or mouse wheel), the distance does not count
if (((dist2 < dist1 && dist2 && dir !== 2) || !dist1 || (v - dist1 < 0) || dir == 1) && cell2.hasClass(‘dw-v‘)) {
cell = cell2;
v = v + dist2;
} else {
cell = cell1;
v = v - dist1;
}
}
if (!(cell.hasClass(‘dw-sel‘)) || sc) {
// Set valid value
that.temp[i] = cell.attr(‘data-val‘);
// Add selected class to cell
$(‘.dw-sel‘, t).removeClass(‘dw-sel‘);
cell.addClass(‘dw-sel‘);
// Scroll to position
//that.scroll(t, i, v, time);
that.scroll(t, i, v, sc ? time : 0.1, sc ? orig : undefined);
}
});
// Reformat value if validation changed something
that.change(manual);
}
}
function position(check) {
if (s.display == ‘inline‘ || (ww === $(window).width() && rwh === $(window).height() && check)) {
return;
}
var w,
l,
t,
aw, // anchor width
ah, // anchor height
ap, // anchor position
at, // anchor top
al, // anchor left
arr, // arrow
arrw, // arrow width
arrl, // arrow left
scroll,
totalw = 0,
minw = 0,
st = $(window).scrollTop(),
wr = $(‘.dwwr‘, dw),
d = $(‘.dw‘, dw),
css = {},
anchor = s.anchor === undefined ? elm : s.anchor;
ww = $(window).width();
rwh = $(window).height();
wh = window.innerHeight; // on iOS we need innerHeight
wh = wh || rwh;
if (/modal|bubble/.test(s.display)) {
$(‘.dwc‘, dw).each(function () {
w = $(this).outerWidth(true);
totalw += w;
minw = (w > minw) ? w : minw;
});
w = totalw > ww ? minw : totalw;
wr.width(w);
}
mw = d.outerWidth();
mh = d.outerHeight(true);
if (s.display == ‘modal‘) {
l = (ww - mw) / 2;
t = st + (wh - mh) / 2;
} else if (s.display == ‘bubble‘) {
scroll = true;
arr = $(‘.dw-arrw-i‘, dw);
ap = anchor.offset();
at = ap.top;
al = ap.left;
// horizontal positioning
aw = anchor.outerWidth();
ah = anchor.outerHeight();
l = al - (d.outerWidth(true) - aw) / 2;
l = l > (ww - mw) ? (ww - (mw + 20)) : l;
l = l >= 0 ? l : 20;
// vertical positioning
t = at - mh; //(mh + 3); // above the input
if ((t < st) || (at > st + wh)) { // if doesn‘t fit above or the input is out of the screen
d.removeClass(‘dw-bubble-top‘).addClass(‘dw-bubble-bottom‘);
t = at + ah;// + 3; // below the input
} else {
d.removeClass(‘dw-bubble-bottom‘).addClass(‘dw-bubble-top‘);
}
//t = t >= st ? t : st;
// Calculate Arrow position
arrw = arr.outerWidth();
arrl = al + aw / 2 - (l + (mw - arrw) / 2);
// Limit Arrow position to [0, pocw.width] intervall
$(‘.dw-arr‘, dw).css({ left: arrl > arrw ? arrw : arrl });
} else {
css.width = ‘100%‘;
if (s.display == ‘top‘) {
t = st;
} else if (s.display == ‘bottom‘) {
t = st + wh - mh;
}
}
css.top = t < 0 ? 0 : t;
css.left = l;
d.css(css);
// If top + modal height > doc height, increase doc height
$(‘.dw-persp‘, dw).height(0).height(t + mh > $(document).height() ? t + mh : $(document).height());
// Scroll needed
if (scroll && ((t + mh > st + wh) || (at > st + wh))) {
$(window).scrollTop(t + mh - wh);
}
}
function testTouch(e) {
if (e.type === ‘touchstart‘) {
touch = true;
setTimeout(function () {
touch = false; // Reset if mouse event was not fired
}, 500);
} else if (touch) {
touch = false;
return false;
}
return true;
}
function event(name, args) {
var ret;
args.push(that);
$.each([theme.defaults, pres, settings], function (i, v) {
if (v[name]) { // Call preset event
ret = v[name].apply(e, args);
}
});
return ret;
}
function plus(t) {
var p = +t.data(‘pos‘),
val = p + 1;
calc(t, val > max ? min : val, 1, true);
}
function minus(t) {
var p = +t.data(‘pos‘),
val = p - 1;
calc(t, val < min ? max : val, 2, true);
}
// Public functions
/**
* Enables the scroller and the associated input.
*/
that.enable = function () {
s.disabled = false;
if (input) {
elm.prop(‘disabled‘, false);
}
};
/**
* Disables the scroller and the associated input.
*/
that.disable = function () {
s.disabled = true;
if (input) {
elm.prop(‘disabled‘, true);
}
};
/**
* Scrolls target to the specified position
* @param {Object} t - Target wheel jQuery object.
* @param {Number} index - Index of the changed wheel.
* @param {Number} val - Value.
* @param {Number} time - Duration of the animation, optional.
* @param {Number} orig - Original value.
*/
that.scroll = function (t, index, val, time, orig) {
function getVal(t, b, c, d) {
return c * Math.sin(t / d * (Math.PI / 2)) + b;
}
function ready() {
clearInterval(iv[index]);
delete iv[index];
t.data(‘pos‘, val).closest(‘.dwwl‘).removeClass(‘dwa‘);
}
var px = (m - val) * hi,
i;
if (px == pixels[index] && iv[index]) {
return;
}
if (time && px != pixels[index]) {
// Trigger animation start event
event(‘onAnimStart‘, [dw, index, time]);
}
pixels[index] = px;
t.attr(‘style‘, (prefix + ‘-transition:all ‘ + (time ? time.toFixed(3) : 0) + ‘s ease-out;‘) + (has3d ? (prefix + ‘-transform:translate3d(0,‘ + px + ‘px,0);‘) : (‘top:‘ + px + ‘px;‘)));
if (iv[index]) {
ready();
}
if (time && orig !== undefined) {
i = 0;
t.closest(‘.dwwl‘).addClass(‘dwa‘);
iv[index] = setInterval(function () {
i += 0.1;
t.data(‘pos‘, Math.round(getVal(i, orig, val - orig, time)));
if (i >= time) {
ready();
}
}, 100);
} else {
t.data(‘pos‘, val);
}
};
/**
* Gets the selected wheel values, formats it, and set the value of the scroller instance.
* If input parameter is true, populates the associated input element.
* @param {Boolean} sc - Scroll the wheel in position.
* @param {Boolean} fill - Also set the value of the associated input element. Default is true.
* @param {Number} time - Animation time
* @param {Boolean} temp - If true, then only set the temporary value.(only scroll there but not set the value)
*/
that.setValue = function (sc, fill, time, temp) {
if (!$.isArray(that.temp)) {
that.temp = s.parseValue(that.temp + ‘‘, that);
}
if (visible && sc) {
scrollToPos(time);
}
v = s.formatResult(that.temp);
if (!temp) {
that.values = that.temp.slice(0);
that.val = v;
}
if (fill) {
if (input) {
elm.val(v).trigger(‘change‘);
}
}
};
that.getValues = function () {
var ret = [],
i;
for (i in that._selectedValues) {
ret.push(that._selectedValues[i]);
}
return ret;
};
/**
* Checks if the current selected values are valid together.
* In case of date presets it checks the number of days in a month.
* @param {Number} time - Animation time
* @param {Number} orig - Original value
* @param {Number} i - Currently changed wheel index, -1 if initial validation.
* @param {Number} dir - Scroll direction
*/
that.validate = function (i, dir, time, orig) {
scrollToPos(time, i, true, dir, orig);
};
/**
*
*/
that.change = function (manual) {
v = s.formatResult(that.temp);
if (s.display == ‘inline‘) {
that.setValue(false, manual);
} else {
$(‘.dwv‘, dw).html(formatHeader(v));
}
if (manual) {
event(‘onChange‘, [v]);
}
};
/**
* Changes the values of a wheel, and scrolls to the correct position
*/
that.changeWheel = function (idx, time) {
if (dw) {
var i = 0,
j,
k,
nr = idx.length;
for (j in s.wheels) {
for (k in s.wheels[j]) {
if ($.inArray(i, idx) > -1) {
warr[i] = s.wheels[j][k];
$(‘.dw-ul‘, dw).eq(i).html(generateWheelItems(i));
nr--;
if (!nr) {
position();
scrollToPos(time, undefined, true);
return;
}
}
i++;
}
}
}
};
/**
* Return true if the scroller is currently visible.
*/
that.isVisible = function () {
return visible;
};
/**
*
*/
that.tap = function (el, handler) {
var startX,
startY;
if (s.tap) {
el.bind(‘touchstart‘, function (e) {
e.preventDefault();
startX = getCoord(e, ‘X‘);
startY = getCoord(e, ‘Y‘);
}).bind(‘touchend‘, function (e) {
// If movement is less than 20px, fire the click event handler
if (Math.abs(getCoord(e, ‘X‘) - startX) < 20 && Math.abs(getCoord(e, ‘Y‘) - startY) < 20) {
handler.call(this, e);
}
tap = true;
setTimeout(function () {
tap = false;
}, 300);
});
}
el.bind(‘click‘, function (e) {
if (!tap) {
// If handler was not called on touchend, call it on click;
handler.call(this, e);
}
});
};
/**
* Shows the scroller instance.
* @param {Boolean} prevAnim - Prevent animation if true
*/
that.show = function (prevAnim) {
if (s.disabled || visible) {
return false;
}
if (s.display == ‘top‘) {
anim = ‘slidedown‘;
}
if (s.display == ‘bottom‘) {
anim = ‘slideup‘;
}
// Parse value from input
read();
event(‘onBeforeShow‘, [dw]);
// Create wheels
var l = 0,
i,
label,
mAnim = ‘‘;
if (anim && !prevAnim) {
mAnim = ‘dw-‘ + anim + ‘ dw-in‘;
}
// Create wheels containers
var html = ‘<div class="dw-trans ‘ + s.theme + ‘ dw-‘ + s.display + ‘">‘ + (s.display == ‘inline‘ ? ‘<div class="dw dwbg dwi"><div class="dwwr">‘ : ‘<div class="dw-persp">‘ + ‘<div class="dwo"></div><div class="dw dwbg ‘ + mAnim + ‘"><div class="dw-arrw"><div class="dw-arrw-i"><div class="dw-arr"></div></div></div><div class="dwwr">‘ + (s.headerText ? ‘<div class="dwv"></div>‘ : ‘‘));
for (i = 0; i < s.wheels.length; i++) {
html += ‘<div class="dwc‘ + (s.mode != ‘scroller‘ ? ‘ dwpm‘ : ‘ dwsc‘) + (s.showLabel ? ‘‘ : ‘ dwhl‘) + ‘"><div class="dwwc dwrc"><table cellpadding="0" cellspacing="0"><tr>‘;
// Create wheels
for (label in s.wheels[i]) {
warr[l] = s.wheels[i][label];
html += ‘<td><div class="dwwl dwrc dwwl‘ + l + ‘">‘ + (s.mode != ‘scroller‘ ? ‘<div class="dwwb dwwbp" style="height:‘ + hi + ‘px;line-height:‘ + hi + ‘px;"><span>+</span></div><div class="dwwb dwwbm" style="height:‘ + hi + ‘px;line-height:‘ + hi + ‘px;"><span>–</span></div>‘ : ‘‘) + ‘<div class="dwl">‘ + label + ‘</div><div class="dww" style="height:‘ + (s.rows * hi) + ‘px;min-width:‘ + s.width + ‘px;"><div class="dw-ul">‘;
// Create wheel values
html += generateWheelItems(l);
html += ‘</div><div class="dwwo"></div></div><div class="dwwol"></div></div></td>‘;
l++;
}
html += ‘</tr></table></div></div>‘;
}
html += (s.display != ‘inline‘ ? ‘<div class="dwbc‘ + (s.button3 ? ‘ dwbc-p‘ : ‘‘) + ‘"><span class="dwbw dwb-s"><span class="dwb">‘ + s.setText + ‘</span></span>‘ + (s.button3 ? ‘<span class="dwbw dwb-n"><span class="dwb">‘ + s.button3Text + ‘</span></span>‘ : ‘‘) + ‘<span class="dwbw dwb-c"><span class="dwb">‘ + s.cancelText + ‘</span></span></div></div>‘ : ‘<div class="dwcc"></div>‘) + ‘</div></div></div>‘;
dw = $(html);
scrollToPos();
event(‘onMarkupReady‘, [dw]);
// Show
if (s.display != ‘inline‘) {
dw.appendTo(‘body‘);
// Remove animation class
setTimeout(function () {
dw.removeClass(‘dw-trans‘).find(‘.dw‘).removeClass(mAnim);
}, 350);
} else if (elm.is(‘div‘)) {
elm.html(dw);
} else {
dw.insertAfter(elm);
}
event(‘onMarkupInserted‘, [dw]);
visible = true;
// Theme init
theme.init(dw, that);
if (s.display != ‘inline‘) {
// Init buttons
that.tap($(‘.dwb-s span‘, dw), function () {
if (that.hide(false, ‘set‘) !== false) {
that.setValue(false, true);
event(‘onSelect‘, [that.val]);
}
});
that.tap($(‘.dwb-c span‘, dw), function () {
that.cancel();
});
if (s.button3) {
that.tap($(‘.dwb-n span‘, dw), s.button3);
}
// prevent scrolling if not specified otherwise
if (s.scrollLock) {
dw.bind(‘touchmove‘, function (e) {
if (mh <= wh && mw <= ww) {
e.preventDefault();
}
});
}
// Disable inputs to prevent bleed through (Android bug)
$(‘input,select,button‘).each(function () {
if (!$(this).prop(‘disabled‘)) {
$(this).addClass(‘dwtd‘).prop(‘disabled‘, true);
}
});
// Set position
position();
$(window).bind(‘resize.dw‘, function () {
// Sometimes scrollTop is not correctly set, so we wait a little
clearTimeout(debounce);
debounce = setTimeout(function () {
position(true);
}, 100);
});
}
// Events
dw.delegate(‘.dwwl‘, ‘DOMMouseScroll mousewheel‘, function (e) {
if (!isReadOnly(this)) {
e.preventDefault();
e = e.originalEvent;
var delta = e.wheelDelta ? (e.wheelDelta / 120) : (e.detail ? (-e.detail / 3) : 0),
t = $(‘.dw-ul‘, this),
p = +t.data(‘pos‘),
val = Math.round(p - delta);
setGlobals(t);
calc(t, val, delta < 0 ? 1 : 2);
}
}).delegate(‘.dwb, .dwwb‘, START_EVENT, function (e) {
// Active button
$(this).addClass(‘dwb-a‘);
}).delegate(‘.dwwb‘, START_EVENT, function (e) {
e.stopPropagation();
e.preventDefault();
var w = $(this).closest(‘.dwwl‘);
if (testTouch(e) && !isReadOnly(w) && !w.hasClass(‘dwa‘)) {
click = true;
// + Button
var t = w.find(‘.dw-ul‘),
func = $(this).hasClass(‘dwwbp‘) ? plus : minus;
setGlobals(t);
clearInterval(timer);
timer = setInterval(function () { func(t); }, s.delay);
func(t);
}
}).delegate(‘.dwwl‘, START_EVENT, function (e) {
// Prevent scroll
e.preventDefault();
// Scroll start
if (testTouch(e) && !move && !isReadOnly(this) && !click) {
move = true;
$(document).bind(MOVE_EVENT, onMove);
target = $(‘.dw-ul‘, this);
scrollable = s.mode != ‘clickpick‘;
pos = +target.data(‘pos‘);
setGlobals(target);
moved = iv[index] !== undefined; // Don‘t allow tap, if still moving
start = getCoord(e, ‘Y‘);
startTime = new Date();
stop = start;
that.scroll(target, index, pos, 0.001);
if (scrollable) {
target.closest(‘.dwwl‘).addClass(‘dwa‘);
}
}
});
event(‘onShow‘, [dw, v]);
};
/**
* Hides the scroller instance.
*/
that.hide = function (prevAnim, btn) {
// If onClose handler returns false, prevent hide
if (!visible || event(‘onClose‘, [v, btn]) === false) {
return false;
}
// Re-enable temporary disabled fields
$(‘.dwtd‘).prop(‘disabled‘, false).removeClass(‘dwtd‘);
elm.blur();
// Hide wheels and overlay
if (dw) {
if (s.display != ‘inline‘ && anim && !prevAnim) {
dw.addClass(‘dw-trans‘).find(‘.dw‘).addClass(‘dw-‘ + anim + ‘ dw-out‘);
setTimeout(function () {
dw.remove();
dw = null;
}, 350);
} else {
dw.remove();
dw = null;
}
visible = false;
pixels = {};
// Stop positioning on window resize
$(window).unbind(‘.dw‘);
}
};
/**
* Cancel and hide the scroller instance.
*/
that.cancel = function () {
if (that.hide(false, ‘cancel‘) !== false) {
event(‘onCancel‘, [that.val]);
}
};
/**
* Scroller initialization.
*/
that.init = function (ss) {
// Get theme defaults
theme = extend({ defaults: {}, init: empty }, ms.themes[ss.theme || s.theme]);
// Get language defaults
lang = ms.i18n[ss.lang || s.lang];
extend(settings, ss); // Update original user settings
extend(s, theme.defaults, lang, settings);
that.settings = s;
// Unbind all events (if re-init)
elm.unbind(‘.dw‘);
var preset = ms.presets[s.preset];
if (preset) {
pres = preset.call(e, that);
extend(s, pres, settings); // Load preset settings
extend(methods, pres.methods); // Extend core methods
}
// Set private members
m = Math.floor(s.rows / 2);
hi = s.height;
anim = s.animate;
if (elm.data(‘dwro‘) !== undefined) {
e.readOnly = bool(elm.data(‘dwro‘));
}
if (visible) {
that.hide();
}
if (s.display == ‘inline‘) {
that.show();
} else {
read();
if (input && s.showOnFocus) {
// Set element readonly, save original state
elm.data(‘dwro‘, e.readOnly);
e.readOnly = true;
// Init show datewheel
elm.bind(‘focus.dw‘, function () { that.show(); });
}
}
};
that.trigger = function (name, params) {
return event(name, params);
};
that.values = null;
that.val = null;
that.temp = null;
that._selectedValues = {}; // [];
that.init(settings);
}
function testProps(props) {
var i;
for (i in props) {
if (mod[props[i]] !== undefined) {
return true;
}
}
return false;
}
function testPrefix() {
var prefixes = [‘Webkit‘, ‘Moz‘, ‘O‘, ‘ms‘],
p;
for (p in prefixes) {
if (testProps([prefixes[p] + ‘Transform‘])) {
return ‘-‘ + prefixes[p].toLowerCase();
}
}
return ‘‘;
}
function getInst(e) {
return scrollers[e.id];
}
function getCoord(e, c) {
var org = e.originalEvent,
ct = e.changedTouches;
return ct || (org && org.changedTouches) ? (org ? org.changedTouches[0][‘page‘ + c] : ct[0][‘page‘ + c]) : e[‘page‘ + c];
}
function bool(v) {
return (v === true || v == ‘true‘);
}
function constrain(val, min, max) {
val = val > max ? max : val;
val = val < min ? min : val;
return val;
}
function calc(t, val, dir, anim, orig) {
val = constrain(val, min, max);
var cell = $(‘.dw-li‘, t).eq(val),
o = orig === undefined ? val : orig,
idx = index,
time = anim ? (val == o ? 0.1 : Math.abs((val - o) * 0.1)) : 0;
// Set selected scroller value
inst.temp[idx] = cell.attr(‘data-val‘);
inst.scroll(t, idx, val, time, orig);
setTimeout(function () {
// Validate
inst.validate(idx, dir, time, orig);
}, 10);
}
function init(that, method, args) {
if (methods[method]) {
return methods[method].apply(that, Array.prototype.slice.call(args, 1));
}
if (typeof method === ‘object‘) {
return methods.init.call(that, method);
}
return that;
}
var scrollers = {},
timer,
empty = function () { },
h,
min,
max,
inst, // Current instance
date = new Date(),
uuid = date.getTime(),
move,
click,
target,
index,
start,
stop,
startTime,
pos,
moved,
scrollable,
mod = document.createElement(‘modernizr‘).style,
has3d = testProps([‘perspectiveProperty‘, ‘WebkitPerspective‘, ‘MozPerspective‘, ‘OPerspective‘, ‘msPerspective‘]),
prefix = testPrefix(),
extend = $.extend,
tap,
touch,
START_EVENT = ‘touchstart mousedown‘,
MOVE_EVENT = ‘touchmove mousemove‘,
END_EVENT = ‘touchend mouseup‘,
onMove = function (e) {
if (scrollable) {
e.preventDefault();
stop = getCoord(e, ‘Y‘);
inst.scroll(target, index, constrain(pos + (start - stop) / h, min - 1, max + 1));
}
moved = true;
},
defaults = {
// Options
width: 70,
height: 40,
rows: 3,
delay: 300,
disabled: false,
readonly: false,
showOnFocus: true,
showLabel: true,
wheels: [],
theme: ‘‘,
headerText: ‘{value}‘,
display: ‘modal‘,
mode: ‘scroller‘,
preset: ‘‘,
lang: ‘en-US‘,
setText: ‘Set‘,
cancelText: ‘Cancel‘,
scrollLock: true,
tap: true,
formatResult: function (d) {
return d.join(‘ ‘);
},
parseValue: function (value, inst) {
var w = inst.settings.wheels,
val = value.split(‘ ‘),
ret = [],
j = 0,
i,
l,
v;
for (i = 0; i < w.length; i++) {
for (l in w[i]) {
if (w[i][l][val[j]] !== undefined) {
ret.push(val[j]);
} else {
for (v in w[i][l]) { // Select first value from wheel
ret.push(v);
break;
}
}
j++;
}
}
return ret;
}
},
methods = {
init: function (options) {
if (options === undefined) {
options = {};
}
return this.each(function () {
if (!this.id) {
uuid += 1;
this.id = ‘scoller‘ + uuid;
}
scrollers[this.id] = new Scroller(this, options);
});
},
enable: function () {
return this.each(function () {
var inst = getInst(this);
if (inst) {
inst.enable();
}
});
},
disable: function () {
return this.each(function () {
var inst = getInst(this);
if (inst) {
inst.disable();
}
});
},
isDisabled: function () {
var inst = getInst(this[0]);
if (inst) {
return inst.settings.disabled;
}
},
isVisible: function () {
var inst = getInst(this[0]);
if (inst) {
return inst.isVisible();
}
},
option: function (option, value) {
return this.each(function () {
var inst = getInst(this);
if (inst) {
var obj = {};
if (typeof option === ‘object‘) {
obj = option;
} else {
obj[option] = value;
}
inst.init(obj);
}
});
},
setValue: function (d, fill, time, temp) {
return this.each(function () {
var inst = getInst(this);
if (inst) {
inst.temp = d;
inst.setValue(true, fill, time, temp);
}
});
},
getInst: function () {
return getInst(this[0]);
},
getValue: function () {
var inst = getInst(this[0]);
if (inst) {
return inst.values;
}
},
getValues: function () {
var inst = getInst(this[0]);
if (inst) {
return inst.getValues();
}
},
show: function () {
var inst = getInst(this[0]);
if (inst) {
return inst.show();
}
},
hide: function () {
return this.each(function () {
var inst = getInst(this);
if (inst) {
inst.hide();
}
});
},
destroy: function () {
return this.each(function () {
var inst = getInst(this);
if (inst) {
inst.hide();
$(this).unbind(‘.dw‘);
delete scrollers[this.id];
if ($(this).is(‘input‘)) {
this.readOnly = bool($(this).data(‘dwro‘));
}
}
});
}
};
$(document).bind(END_EVENT, function (e) {
if (move) {
var time = new Date() - startTime,
val = constrain(pos + (start - stop) / h, min - 1, max + 1),
speed,
dist,
tindex,
ttop = target.offset().top;
if (time < 300) {
speed = (stop - start) / time;
dist = (speed * speed) / (2 * 0.0006);
if (stop - start < 0) {
dist = -dist;
}
} else {
dist = stop - start;
}
tindex = Math.round(pos - dist / h);
if (!dist && !moved) { // this is a "tap"
var idx = Math.floor((stop - ttop) / h),
li = $(‘.dw-li‘, target).eq(idx),
hl = scrollable;
if (inst.trigger(‘onValueTap‘, [li]) !== false) {
tindex = idx;
} else {
hl = true;
}
if (hl) {
li.addClass(‘dw-hl‘); // Highlight
setTimeout(function () {
li.removeClass(‘dw-hl‘);
}, 200);
}
}
if (scrollable) {
calc(target, tindex, 0, true, Math.round(val));
}
move = false;
target = null;
$(document).unbind(MOVE_EVENT, onMove);
}
if (click) {
clearInterval(timer);
click = false;
}
$(‘.dwb-a‘).removeClass(‘dwb-a‘);
}).bind(‘mouseover mouseup mousedown click‘, function (e) { // Prevent standard behaviour on body click
if (tap) {
e.stopPropagation();
e.preventDefault();
return false;
}
});
$.fn.mobiscroll = function (method) {
extend(this, $.mobiscroll.shorts);
return init(this, method, arguments);
};
$.mobiscroll = $.mobiscroll || {
/**
* Set settings for all instances.
* @param {Object} o - New default settings.
*/
setDefaults: function (o) {
extend(defaults, o);
},
presetShort: function (name) {
this.shorts[name] = function (method) {
return init(this, extend(method, { preset: name }), arguments);
};
},
shorts: {},
presets: {},
themes: {},
i18n: {}
};
$.scroller = $.scroller || $.mobiscroll;
$.fn.scroller = $.fn.scroller || $.fn.mobiscroll;
})(jQuery);
mobiscroll_002
(function ($) {
$.mobiscroll.i18n.zh = $.extend($.mobiscroll.i18n.zh, {
setText: ‘确定‘,
cancelText: ‘取消‘
});
})(jQuery);
mobiscroll_004.js
/*jslint eqeq: true, plusplus: true, undef: true, sloppy: true, vars: true, forin: true */
(function ($) {
var ms = $.mobiscroll,
date = new Date(),
defaults = {
dateFormat: ‘mm/dd/yy‘,
dateOrder: ‘mmddy‘,
timeWheels: ‘hhiiA‘,
timeFormat: ‘hh:ii A‘,
startYear: date.getFullYear() - 100,
endYear: date.getFullYear() + 1,
monthNames: [‘January‘, ‘February‘, ‘March‘, ‘April‘, ‘May‘, ‘June‘, ‘July‘, ‘August‘, ‘September‘, ‘October‘, ‘November‘, ‘December‘],
monthNamesShort: [‘Jan‘, ‘Feb‘, ‘Mar‘, ‘Apr‘, ‘May‘, ‘Jun‘, ‘Jul‘, ‘Aug‘, ‘Sep‘, ‘Oct‘, ‘Nov‘, ‘Dec‘],
dayNames: [‘Sunday‘, ‘Monday‘, ‘Tuesday‘, ‘Wednesday‘, ‘Thursday‘, ‘Friday‘, ‘Saturday‘],
dayNamesShort: [‘Sun‘, ‘Mon‘, ‘Tue‘, ‘Wed‘, ‘Thu‘, ‘Fri‘, ‘Sat‘],
shortYearCutoff: ‘+10‘,
monthText: ‘Month‘,
dayText: ‘Day‘,
yearText: ‘Year‘,
hourText: ‘Hours‘,
minuteText: ‘Minutes‘,
secText: ‘Seconds‘,
ampmText: ‘ ‘,
nowText: ‘Now‘,
showNow: false,
stepHour: 1,
stepMinute: 1,
stepSecond: 1,
separator: ‘ ‘
},
preset = function (inst) {
var that = $(this),
html5def = {},
format;
// Force format for html5 date inputs (experimental)
if (that.is(‘input‘)) {
switch (that.attr(‘type‘)) {
case ‘date‘:
format = ‘yy-mm-dd‘;
break;
case ‘datetime‘:
format = ‘yy-mm-ddTHH:ii:ssZ‘;
break;
case ‘datetime-local‘:
format = ‘yy-mm-ddTHH:ii:ss‘;
break;
case ‘month‘:
format = ‘yy-mm‘;
html5def.dateOrder = ‘mmyy‘;
break;
case ‘time‘:
format = ‘HH:ii:ss‘;
break;
}
// Check for min/max attributes
var min = that.attr(‘min‘),
max = that.attr(‘max‘);
if (min) {
html5def.minDate = ms.parseDate(format, min);
}
if (max) {
html5def.maxDate = ms.parseDate(format, max);
}
}
// Set year-month-day order
var s = $.extend({}, defaults, html5def, inst.settings),
offset = 0,
wheels = [],
ord = [],
o = {},
i,
k,
f = { y: ‘getFullYear‘, m: ‘getMonth‘, d: ‘getDate‘, h: getHour, i: getMinute, s: getSecond, a: getAmPm },
p = s.preset,
dord = s.dateOrder,
tord = s.timeWheels,
regen = dord.match(/D/),
ampm = tord.match(/a/i),
hampm = tord.match(/h/),
hformat = p == ‘datetime‘ ? s.dateFormat + s.separator + s.timeFormat : p == ‘time‘ ? s.timeFormat : s.dateFormat,
defd = new Date(),
stepH = s.stepHour,
stepM = s.stepMinute,
stepS = s.stepSecond,
mind = s.minDate || new Date(s.startYear, 0, 1),
maxd = s.maxDate || new Date(s.endYear, 11, 31, 23, 59, 59);
inst.settings = s;
format = format || hformat;
if (p.match(/date/i)) {
// Determine the order of year, month, day wheels
$.each([‘y‘, ‘m‘, ‘d‘], function (j, v) {
i = dord.search(new RegExp(v, ‘i‘));
if (i > -1) {
ord.push({ o: i, v: v });
}
});
ord.sort(function (a, b) { return a.o > b.o ? 1 : -1; });
$.each(ord, function (i, v) {
o[v.v] = i;
});
var w = {};
for (k = 0; k < 3; k++) {
if (k == o.y) {
offset++;
w[s.yearText] = {};
var start = mind.getFullYear(),
end = maxd.getFullYear();
for (i = start; i <= end; i++) {
w[s.yearText][i] = dord.match(/yy/i) ? i : (i + ‘‘).substr(2, 2);
}
} else if (k == o.m) {
offset++;
w[s.monthText] = {};
for (i = 0; i < 12; i++) {
var str = dord.replace(/[dy]/gi, ‘‘).replace(/mm/, i < 9 ? ‘0‘ + (i + 1) : i + 1).replace(/m/, (i + 1));
w[s.monthText][i] = str.match(/MM/) ? str.replace(/MM/, ‘<span class="dw-mon">‘ + s.monthNames[i] + ‘</span>‘) : str.replace(/M/, ‘<span class="dw-mon">‘ + s.monthNamesShort[i] + ‘</span>‘);
}
} else if (k == o.d) {
offset++;
w[s.dayText] = {};
for (i = 1; i < 32; i++) {
w[s.dayText][i] = dord.match(/dd/i) && i < 10 ? ‘0‘ + i : i;
}
}
}
wheels.push(w);
}
if (p.match(/time/i)) {
// Determine the order of hours, minutes, seconds wheels
ord = [];
$.each([‘h‘, ‘i‘, ‘s‘, ‘a‘], function (i, v) {
i = tord.search(new RegExp(v, ‘i‘));
if (i > -1) {
ord.push({ o: i, v: v });
}
});
ord.sort(function (a, b) {
return a.o > b.o ? 1 : -1;
});
$.each(ord, function (i, v) {
o[v.v] = offset + i;
});
w = {};
for (k = offset; k < offset + 4; k++) {
if (k == o.h) {
offset++;
w[s.hourText] = {};
for (i = 0; i < (hampm ? 12 : 24); i += stepH) {
w[s.hourText][i] = hampm && i == 0 ? 12 : tord.match(/hh/i) && i < 10 ? ‘0‘ + i : i;
}
} else if (k == o.i) {
offset++;
w[s.minuteText] = {};
for (i = 0; i < 60; i += stepM) {
w[s.minuteText][i] = tord.match(/ii/) && i < 10 ? ‘0‘ + i : i;
}
} else if (k == o.s) {
offset++;
w[s.secText] = {};
for (i = 0; i < 60; i += stepS) {
w[s.secText][i] = tord.match(/ss/) && i < 10 ? ‘0‘ + i : i;
}
} else if (k == o.a) {
offset++;
var upper = tord.match(/A/);
w[s.ampmText] = { 0: upper ? ‘AM‘ : ‘am‘, 1: upper ? ‘PM‘ : ‘pm‘ };
}
}
wheels.push(w);
}
function get(d, i, def) {
if (o[i] !== undefined) {
return +d[o[i]];
}
if (def !== undefined) {
return def;
}
return defd[f[i]] ? defd[f[i]]() : f[i](defd);
}
function step(v, st) {
return Math.floor(v / st) * st;
}
function getHour(d) {
var hour = d.getHours();
hour = hampm && hour >= 12 ? hour - 12 : hour;
return step(hour, stepH);
}
function getMinute(d) {
return step(d.getMinutes(), stepM);
}
function getSecond(d) {
return step(d.getSeconds(), stepS);
}
function getAmPm(d) {
return ampm && d.getHours() > 11 ? 1 : 0;
}
function getDate(d) {
var hour = get(d, ‘h‘, 0);
return new Date(get(d, ‘y‘), get(d, ‘m‘), get(d, ‘d‘, 1), get(d, ‘a‘) ? hour + 12 : hour, get(d, ‘i‘, 0), get(d, ‘s‘, 0));
}
inst.setDate = function (d, fill, time, temp) {
var i;
// Set wheels
for (i in o) {
this.temp[o[i]] = d[f[i]] ? d[f[i]]() : f[i](d);
}
this.setValue(true, fill, time, temp);
};
inst.getDate = function (d) {
return getDate(d);
};
return {
button3Text: s.showNow ? s.nowText : undefined,
button3: s.showNow ? function () { inst.setDate(new Date(), false, 0.3, true); } : undefined,
wheels: wheels,
headerText: function (v) {
return ms.formatDate(hformat, getDate(inst.temp), s);
},
/**
* Builds a date object from the wheel selections and formats it to the given date/time format
* @param {Array} d - An array containing the selected wheel values
* @return {String} - The formatted date string
*/
formatResult: function (d) {
return ms.formatDate(format, getDate(d), s);
},
/**
* Builds a date object from the input value and returns an array to set wheel values
* @return {Array} - An array containing the wheel values to set
*/
parseValue: function (val) {
var d = new Date(),
i,
result = [];
try {
d = ms.parseDate(format, val, s);
} catch (e) {
}
// Set wheels
for (i in o) {
result[o[i]] = d[f[i]] ? d[f[i]]() : f[i](d);
}
return result;
},
/**
* Validates the selected date to be in the minDate / maxDate range and sets unselectable values to disabled
* @param {Object} dw - jQuery object containing the generated html
* @param {Integer} [i] - Index of the changed wheel, not set for initial validation
*/
validate: function (dw, i) {
var temp = inst.temp, //.slice(0),
mins = { y: mind.getFullYear(), m: 0, d: 1, h: 0, i: 0, s: 0, a: 0 },
maxs = { y: maxd.getFullYear(), m: 11, d: 31, h: step(hampm ? 11 : 23, stepH), i: step(59, stepM), s: step(59, stepS), a: 1 },
minprop = true,
maxprop = true;
$.each([‘y‘, ‘m‘, ‘d‘, ‘a‘, ‘h‘, ‘i‘, ‘s‘], function (x, i) {
if (o[i] !== undefined) {
var min = mins[i],
max = maxs[i],
maxdays = 31,
val = get(temp, i),
t = $(‘.dw-ul‘, dw).eq(o[i]),
y,
m;
if (i == ‘d‘) {
y = get(temp, ‘y‘);
m = get(temp, ‘m‘);
maxdays = 32 - new Date(y, m, 32).getDate();
max = maxdays;
if (regen) {
$(‘.dw-li‘, t).each(function () {
var that = $(this),
d = that.data(‘val‘),
w = new Date(y, m, d).getDay(),
str = dord.replace(/[my]/gi, ‘‘).replace(/dd/, d < 10 ? ‘0‘ + d : d).replace(/d/, d);
$(‘.dw-i‘, that).html(str.match(/DD/) ? str.replace(/DD/, ‘<span class="dw-day">‘ + s.dayNames[w] + ‘</span>‘) : str.replace(/D/, ‘<span class="dw-day">‘ + s.dayNamesShort[w] + ‘</span>‘));
});
}
}
if (minprop && mind) {
min = mind[f[i]] ? mind[f[i]]() : f[i](mind);
}
if (maxprop && maxd) {
max = maxd[f[i]] ? maxd[f[i]]() : f[i](maxd);
}
if (i != ‘y‘) {
var i1 = $(‘.dw-li‘, t).index($(‘.dw-li[data-val="‘ + min + ‘"]‘, t)),
i2 = $(‘.dw-li‘, t).index($(‘.dw-li[data-val="‘ + max + ‘"]‘, t));
$(‘.dw-li‘, t).removeClass(‘dw-v‘).slice(i1, i2 + 1).addClass(‘dw-v‘);
if (i == ‘d‘) { // Hide days not in month
$(‘.dw-li‘, t).removeClass(‘dw-h‘).slice(maxdays).addClass(‘dw-h‘);
}
}
if (val < min) {
val = min;
}
if (val > max) {
val = max;
}
if (minprop) {
minprop = val == min;
}
if (maxprop) {
maxprop = val == max;
}
// Disable some days
if (s.invalid && i == ‘d‘) {
var idx = [];
// Disable exact dates
if (s.invalid.dates) {
$.each(s.invalid.dates, function (i, v) {
if (v.getFullYear() == y && v.getMonth() == m) {
idx.push(v.getDate() - 1);
}
});
}
// Disable days of week
if (s.invalid.daysOfWeek) {
var first = new Date(y, m, 1).getDay(),
j;
$.each(s.invalid.daysOfWeek, function (i, v) {
for (j = v - first; j < maxdays; j += 7) {
if (j >= 0) {
idx.push(j);
}
}
});
}
// Disable days of month
if (s.invalid.daysOfMonth) {
$.each(s.invalid.daysOfMonth, function (i, v) {
v = (v + ‘‘).split(‘/‘);
if (v[1]) {
if (v[0] - 1 == m) {
idx.push(v[1] - 1);
}
} else {
idx.push(v[0] - 1);
}
});
}
$.each(idx, function (i, v) {
$(‘.dw-li‘, t).eq(v).removeClass(‘dw-v‘);
});
}
// Set modified value
temp[o[i]] = val;
}
});
},
methods: {
/**
* Returns the currently selected date.
* @param {Boolean} temp - If true, return the currently shown date on the picker, otherwise the last selected one
* @return {Date}
*/
getDate: function (temp) {
var inst = $(this).mobiscroll(‘getInst‘);
if (inst) {
return inst.getDate(temp ? inst.temp : inst.values);
}
},
/**
* Sets the selected date
* @param {Date} d - Date to select.
* @param {Boolean} [fill] - Also set the value of the associated input element. Default is true.
* @return {Object} - jQuery object to maintain chainability
*/
setDate: function (d, fill, time, temp) {
if (fill == undefined) {
fill = false;
}
return this.each(function () {
var inst = $(this).mobiscroll(‘getInst‘);
if (inst) {
inst.setDate(d, fill, time, temp);
}
});
}
}
};
};
$.each([‘date‘, ‘time‘, ‘datetime‘], function (i, v) {
ms.presets[v] = preset;
ms.presetShort(v);
});
/**
* Format a date into a string value with a specified format.
* @param {String} format - Output format.
* @param {Date} date - Date to format.
* @param {Object} settings - Settings.
* @return {String} - Returns the formatted date string.
*/
ms.formatDate = function (format, date, settings) {
if (!date) {
return null;
}
var s = $.extend({}, defaults, settings),
look = function (m) { // Check whether a format character is doubled
var n = 0;
while (i + 1 < format.length && format.charAt(i + 1) == m) {
n++;
i++;
}
return n;
},
f1 = function (m, val, len) { // Format a number, with leading zero if necessary
var n = ‘‘ + val;
if (look(m)) {
while (n.length < len) {
n = ‘0‘ + n;
}
}
return n;
},
f2 = function (m, val, s, l) { // Format a name, short or long as requested
return (look(m) ? l[val] : s[val]);
},
i,
output = ‘‘,
literal = false;
for (i = 0; i < format.length; i++) {
if (literal) {
if (format.charAt(i) == "‘" && !look("‘")) {
literal = false;
} else {
output += format.charAt(i);
}
} else {
switch (format.charAt(i)) {
case ‘d‘:
output += f1(‘d‘, date.getDate(), 2);
break;
case ‘D‘:
output += f2(‘D‘, date.getDay(), s.dayNamesShort, s.dayNames);
break;
case ‘o‘:
output += f1(‘o‘, (date.getTime() - new Date(date.getFullYear(), 0, 0).getTime()) / 86400000, 3);
break;
case ‘m‘:
output += f1(‘m‘, date.getMonth() + 1, 2);
break;
case ‘M‘:
output += f2(‘M‘, date.getMonth(), s.monthNamesShort, s.monthNames);
break;
case ‘y‘:
output += (look(‘y‘) ? date.getFullYear() : (date.getYear() % 100 < 10 ? ‘0‘ : ‘‘) + date.getYear() % 100);
break;
case ‘h‘:
var h = date.getHours();
output += f1(‘h‘, (h > 12 ? (h - 12) : (h == 0 ? 12 : h)), 2);
break;
case ‘H‘:
output += f1(‘H‘, date.getHours(), 2);
break;
case ‘i‘:
output += f1(‘i‘, date.getMinutes(), 2);
break;
case ‘s‘:
output += f1(‘s‘, date.getSeconds(), 2);
break;
case ‘a‘:
output += date.getHours() > 11 ? ‘pm‘ : ‘am‘;
break;
case ‘A‘:
output += date.getHours() > 11 ? ‘PM‘ : ‘AM‘;
break;
case "‘":
if (look("‘")) {
output += "‘";
} else {
literal = true;
}
break;
default:
output += format.charAt(i);
}
}
}
return output;
};
/**
* Extract a date from a string value with a specified format.
* @param {String} format - Input format.
* @param {String} value - String to parse.
* @param {Object} settings - Settings.
* @return {Date} - Returns the extracted date.
*/
ms.parseDate = function (format, value, settings) {
var def = new Date();
if (!format || !value) {
return def;
}
value = (typeof value == ‘object‘ ? value.toString() : value + ‘‘);
var s = $.extend({}, defaults, settings),
shortYearCutoff = s.shortYearCutoff,
year = def.getFullYear(),
month = def.getMonth() + 1,
day = def.getDate(),
doy = -1,
hours = def.getHours(),
minutes = def.getMinutes(),
seconds = 0, //def.getSeconds(),
ampm = -1,
literal = false, // Check whether a format character is doubled
lookAhead = function (match) {
var matches = (iFormat + 1 < format.length && format.charAt(iFormat + 1) == match);
if (matches) {
iFormat++;
}
return matches;
},
getNumber = function (match) { // Extract a number from the string value
lookAhead(match);
var size = (match == ‘@‘ ? 14 : (match == ‘!‘ ? 20 : (match == ‘y‘ ? 4 : (match == ‘o‘ ? 3 : 2)))),
digits = new RegExp(‘^\\d{1,‘ + size + ‘}‘),
num = value.substr(iValue).match(digits);
if (!num) {
return 0;
}
//throw ‘Missing number at position ‘ + iValue;
iValue += num[0].length;
return parseInt(num[0], 10);
},
getName = function (match, s, l) { // Extract a name from the string value and convert to an index
var names = (lookAhead(match) ? l : s),
i;
for (i = 0; i < names.length; i++) {
if (value.substr(iValue, names[i].length).toLowerCase() == names[i].toLowerCase()) {
iValue += names[i].length;
return i + 1;
}
}
return 0;
//throw ‘Unknown name at position ‘ + iValue;
},
checkLiteral = function () {
//if (value.charAt(iValue) != format.charAt(iFormat))
//throw ‘Unexpected literal at position ‘ + iValue;
iValue++;
},
iValue = 0,
iFormat;
for (iFormat = 0; iFormat < format.length; iFormat++) {
if (literal) {
if (format.charAt(iFormat) == "‘" && !lookAhead("‘")) {
literal = false;
} else {
checkLiteral();
}
} else {
switch (format.charAt(iFormat)) {
case ‘d‘:
day = getNumber(‘d‘);
break;
case ‘D‘:
getName(‘D‘, s.dayNamesShort, s.dayNames);
break;
case ‘o‘:
doy = getNumber(‘o‘);
break;
case ‘m‘:
month = getNumber(‘m‘);
break;
case ‘M‘:
month = getName(‘M‘, s.monthNamesShort, s.monthNames);
break;
case ‘y‘:
year = getNumber(‘y‘);
break;
case ‘H‘:
hours = getNumber(‘H‘);
break;
case ‘h‘:
hours = getNumber(‘h‘);
break;
case ‘i‘:
minutes = getNumber(‘i‘);
break;
case ‘s‘:
seconds = getNumber(‘s‘);
break;
case ‘a‘:
ampm = getName(‘a‘, [‘am‘, ‘pm‘], [‘am‘, ‘pm‘]) - 1;
break;
case ‘A‘:
ampm = getName(‘A‘, [‘am‘, ‘pm‘], [‘am‘, ‘pm‘]) - 1;
break;
case "‘":
if (lookAhead("‘")) {
checkLiteral();
} else {
literal = true;
}
break;
default:
checkLiteral();
}
}
}
if (year < 100) {
year += new Date().getFullYear() - new Date().getFullYear() % 100 +
(year <= (typeof shortYearCutoff != ‘string‘ ? shortYearCutoff : new Date().getFullYear() % 100 + parseInt(shortYearCutoff, 10)) ? 0 : -100);
}
if (doy > -1) {
month = 1;
day = doy;
do {
var dim = 32 - new Date(year, month - 1, 32).getDate();
if (day <= dim) {
break;
}
month++;
day -= dim;
} while (true);
}
hours = (ampm == -1) ? hours : ((ampm && hours < 12) ? (hours + 12) : (!ampm && hours == 12 ? 0 : hours));
var date = new Date(year, month - 1, day, hours, minutes, seconds);
if (date.getFullYear() != year || date.getMonth() + 1 != month || date.getDate() != day) {
throw ‘Invalid date‘;
}
return date;
};
})(jQuery);
mobiscroll.js
<!-- 陈廷峰增加中文资源包 ([email protected]) -->
(function ($) {
$.mobiscroll.i18n.zh = $.extend($.mobiscroll.i18n.zh, {
dateFormat: ‘yyyy-mm-dd‘,
dateOrder: ‘yymmdd‘,
dayNames: [‘周日‘, ‘周一;‘, ‘周二;‘, ‘周三‘, ‘周四‘, ‘周五‘, ‘周六‘],
dayNamesShort: [‘日‘, ‘一‘, ‘二‘, ‘三‘, ‘四‘, ‘五‘, ‘六‘],
dayText: ‘日‘,
hourText: ‘时‘,
minuteText: ‘分‘,
monthNames: [‘一月‘, ‘二月‘, ‘三月‘, ‘四月‘, ‘五月‘, ‘六月‘, ‘七月‘, ‘八月‘, ‘九月‘, ‘十月‘, ‘十一月‘, ‘十二月‘],
monthNamesShort: [‘1月‘, ‘2月‘, ‘3月‘, ‘4月‘, ‘5月‘, ‘6月‘, ‘7月‘, ‘8月‘, ‘9月‘, ‘10月‘, ‘11月‘, ‘12月‘],
monthText: ‘月‘,
secText: ‘秒‘,
timeFormat: ‘HH:ii‘,
timeWheels: ‘HHii‘,
yearText: ‘年‘
});
})(jQuery);
mobiscroll_003.js
(function ($) {
var theme = {
defaults: {
dateOrder: ‘Mddyy‘,
mode: ‘mixed‘,
rows: 5,
width: 70,
height: 36,
showLabel: true,
useShortLabels: true
}
}
$.mobiscroll.themes[‘android-ics‘] = theme;
$.mobiscroll.themes[‘android-ics light‘] = theme;
})(jQuery);
mobiscroll_005.js
<!--时间选择-->
<script type="text/javascript">
$(function() {
var currYear = (new Date()).getFullYear();
var opt = {};
opt.date = {
preset: ‘date‘ //显示年月日
};
opt.datetime = {
preset: ‘datetime‘ //显示年月日时分秒
};
opt.time = {
preset: ‘time‘ //显示时分
};
opt.default = {
theme: ‘android-ics light‘, //皮肤样式
display: ‘modal‘, //显示方式
mode: ‘scroller‘, //日期选择模式
dateFormat: ‘yyyy-mm-dd‘,
lang: ‘zh‘,
showNow: true,
nowText: "今天",
startYear: currYear - 20, //开始年份
endYear: currYear + 20 //结束年份
};
var optDateTime = $.extend(opt[‘datetime‘], opt[‘default‘]); //显示年月日时分秒 选date
$("#appDateTime").mobiscroll(optDateTime).datetime(optDateTime);
});
</script>
<input type="text" class="fhinput" name="appDateTime" id="appDateTime" value="">
原文地址：https://www.cnblogs.com/dazhangli/p/8548414.html
时间： 2024-11-05 21:52:31