iFish/Light12306
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

增加触控效果

Browse Source
This commit is contained in:
luolei 2014-09-04 22:49:32 +08:00
parent 9f561f2f3b
commit 45e355c4c7
1 changed files with 16 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
Mobile12306New/css/css.css
View File

@ -44,8 +44,9 @@ input[type=radio]:checked:after{content:''; display:block; width:12px; height:12
.pull_left{float:left;} .pull_left{float:left;}
.pull_right{float:right;} .pull_right{float:right;}
.pull_left:active .icon_left,.pull_right:active .icon_right{opacity: .5}
.text_warning{color:#fa8c13;} .text_warning{color:#fa8c13;}
.text_warning:active{color: #FFBB51}
.text_error{color:#da0000;} .text_error{color:#da0000;}
.text_gray{color:#b7b7b7;} .text_gray{color:#b7b7b7;}
.text_lg{ font-size:1.25em;} .text_lg{ font-size:1.25em;}
@ -61,7 +62,7 @@ input[type=radio]:checked:after{content:''; display:block; width:12px; height:12
/*icon*/ /*icon*/
.icon_change{display: inline-block; width:22px; height:22px; border-radius:50%; overflow:hidden; border:#DDD solid 1px; background-position:4px -245px; background-color:#FFF;} .icon_change{display: inline-block; width:22px; height:22px; border-radius:50%; overflow:hidden; border:#DDD solid 1px; background-position:4px -245px; background-color:#FFF;}
/*.icon_change:active{border: 1px solid rgba(199,199,199,.5);background-color: rgba(199,199,199,.5)}*/
.icon_back{display:inline-block; width:45px; height:45px; overflow:hidden; background-position:18px -85px;} .icon_back{display:inline-block; width:45px; height:45px; overflow:hidden; background-position:18px -85px;}
.icon_left, .icon_left,
@ -98,6 +99,7 @@ input[type=radio]:checked:after{content:''; display:block; width:12px; height:12
.h_l a{padding-right:1.2rem;text-align: left;} .h_l a{padding-right:1.2rem;text-align: left;}
.h_r a{padding-left:1.2rem;text-align: right;} .h_r a{padding-left:1.2rem;text-align: right;}
.h_l a.logo{ display:block;width:122px; height:26px; overflow:hidden; background:url(../images/logo.png) no-repeat; background-size:122px 26px; margin:10px 0 0;padding:0;} .h_l a.logo{ display:block;width:122px; height:26px; overflow:hidden; background:url(../images/logo.png) no-repeat; background-size:122px 26px; margin:10px 0 0;padding:0;}
.h_r a:active .icon_user,.h_l:active .logo{opacity: .5}
.h_r_text{ padding:5px 0; text-align:right; line-height:16px;} .h_r_text{ padding:5px 0; text-align:right; line-height:16px;}
.header .icon_back{margin-left:-15px;} .header .icon_back{margin-left:-15px;}
.header a{color:#FFF; font-size:0.875rem;display: block;} .header a{color:#FFF; font-size:0.875rem;display: block;}
@ -105,6 +107,8 @@ input[type=radio]:checked:after{content:''; display:block; width:12px; height:12
.box_insert{background:#FFF; border-bottom:#ddd solid 1px;padding:0 15px;} .box_insert{background:#FFF; border-bottom:#ddd solid 1px;padding:0 15px;}
#open_filter:active{color:#666;background: rgba(200,200,200,.1);border-radius: 3px}
#open_filter:active .pull_right{opacity: 0};
#loginForm .text_warning{display: inline-block;height: 20px;padding: 5px 10px;margin-right: -10px} #loginForm .text_warning{display: inline-block;height: 20px;padding: 5px 10px;margin-right: -10px}
#loginForm .form_btns{margin: 10px 0} #loginForm .form_btns{margin: 10px 0}
.form_btns{ margin:15px 0;} .form_btns{ margin:15px 0;}
@ -125,6 +129,7 @@ input[type=radio]:checked:after{content:''; display:block; width:12px; height:12
.btn_lg{height:45px; line-height:45px;} .btn_lg{height:45px; line-height:45px;}
.btn_m{height:30px; line-height:30px; font-size:0.75rem;} .btn_m{height:30px; line-height:30px; font-size:0.75rem;}
.btn_success{background:#fa8c13;} .btn_success{background:#fa8c13;}
.btn_success:active{background: #fa7a13;box-shadow: 0 1px 0px #fa6f13}
.btn_gray{background:#b5b5b5;} .btn_gray{background:#b5b5b5;}
.box{padding:10px 15px;} .box{padding:10px 15px;}
@ -144,7 +149,10 @@ input[type=radio]:checked:after{content:''; display:block; width:12px; height:12
.start_station{border-right:1px solid #DDD; padding-right:10px;} .start_station{border-right:1px solid #DDD; padding-right:10px;}
.end_station{padding-left:10px;} .end_station{padding-left:10px;}
#exchange{position: absolute;left: 50%; width: 22px; height: 22px; padding: 20px; top: 50%; margin-left: -33px; margin-top: -24px; display: block;} #exchange{position: absolute;left: 50%; width: 22px; height: 22px; padding: 20px; top: 50%; margin-left: -33px; margin-top: -24px; display: block;}
#exchange:active{background:rgba(200,200,200,.1);border-radius: 50%;}
#exchange:active .icon_change{border: 1px solid rgba(199,199,199,.1);background-color: rgba(199,199,199,.5);}
.station_city{padding:30px 0; font-size:1.5rem; color:#000; position:relative;} .station_city{padding:30px 0; font-size:1.5rem; color:#000; position:relative;}
.station_city:active{background: rgba(200,200,200,.1);border-radius: 3px}
#query_page .station_city:after, #query_page .station_city:after,
#remind_page .station_city:after{content:''; position:absolute; width:15px; height:15px; background: url(../images/icons.png) no-repeat 0 -700px; background-size:24px auto; left:50%; bottom:0; margin:0 0 0 -7px;} #remind_page .station_city:after{content:''; position:absolute; width:15px; height:15px; background: url(../images/icons.png) no-repeat 0 -700px; background-size:24px auto; left:50%; bottom:0; margin:0 0 0 -7px;}
@ -157,7 +165,9 @@ input[type=radio]:checked:after{content:''; display:block; width:12px; height:12
.check_right{width:40px; height:40px; text-align:center;} .check_right{width:40px; height:40px; text-align:center;}
.check_left{ text-align:left;} .check_left{ text-align:left;}
.check_right{text-align:right;} .check_right{text-align:right;}
.check_right:active,.check_left:active{background: rgba(200,200,200,.1);}
.check_right:active .icon_right{opacity: 0.5}
.check_left:active .icon_left{opacity: 0.5}
.his_title{text-align:center;} .his_title{text-align:center;}
.his_list a{ display:block; height:40px; line-height:40px; overflow:hidden; position: relative; color:#787878;} .his_list a{ display:block; height:40px; line-height:40px; overflow:hidden; position: relative; color:#787878;}
.his_list a span{ display:inline-block; width:50%; -webkit-box-sizing:border-box;} .his_list a span{ display:inline-block; width:50%; -webkit-box-sizing:border-box;}
@ -172,7 +182,7 @@ input[type=radio]:checked:after{content:''; display:block; width:12px; height:12
.public_pop p{padding:15px 20px; text-align:center; line-height:2em; font-size:1em;} .public_pop p{padding:15px 20px; text-align:center; line-height:2em; font-size:1em;}
.public_btns {height: 45px;-webkit-box-flex: 0.0;display: -webkit-box;border-top: #dfdfdf solid 1px;} .public_btns {height: 45px;-webkit-box-flex: 0.0;display: -webkit-box;border-top: #dfdfdf solid 1px;}
.public_btns a {display: block;-webkit-box-flex: 1.0;text-align: center;line-height: 44px;color: #007aff;border-right: #dfdfdf solid 1px;width: 50%;} .public_btns a {display: block;-webkit-box-flex: 1.0;text-align: center;line-height: 44px;color: #007aff;border-right: #dfdfdf solid 1px;width: 50%;}
.public_btns a.active{background:rgba(0,0,0,.05);} .public_btns a.active{background:rgba(200,200,200,.05);}
.public_btns a:last-child {border-right:0 none;} .public_btns a:last-child {border-right:0 none;}
.public_toast{padding:5px 10px; border-radius:3px; background:rgba(0,0,0,.7); position:fixed; left:50%; bottom:20px; max-width:150px; z-index:9999; color:#FFF; font-size:12px; -webkit-transform:translate3d(-50%,100%,0); opacity:0; transition:all linear .1s;} .public_toast{padding:5px 10px; border-radius:3px; background:rgba(0,0,0,.7); position:fixed; left:50%; bottom:20px; max-width:150px; z-index:9999; color:#FFF; font-size:12px; -webkit-transform:translate3d(-50%,100%,0); opacity:0; transition:all linear .1s;}
@ -235,7 +245,7 @@ input[type=radio]:checked:after{content:''; display:block; width:12px; height:12
.bottom_tip{position:fixed; width:100%; height:57px; left:0; bottom:0; display:none; overflow:hidden;} .bottom_tip{position:fixed; width:100%; height:57px; left:0; bottom:0; display:none; overflow:hidden;}
.bottom_tip a{display:block; background:rgba(0,0,0,.8); padding:1.3em 1em; font-size:0.9375rem; color:#FFF; position:relative;} .bottom_tip a{display:block; background:rgba(0,0,0,.8); padding:1.3em 1em; font-size:0.9375rem; color:#FFF; position:relative;}
#login_tip a:after{content:"登录"; position: absolute; right:1em; background:#fa8c13; padding:0 1.5em; height:2em; line-height:2em; top:50%; -webkit-transform:translate3d(0,-50%,0); border-radius:3px;} #login_tip a:after{content:"登录"; position: absolute; right:1em; background:#fa8c13; padding:0 1.5em; height:2em; line-height:2em; top:50%; -webkit-transform:translate3d(0,-50%,0); border-radius:3px;}
#login_tip a:active:after{background: #fa7a13}
/**/ /**/
.top_menu{top:45px; bottom:0; width:100%; position: absolute; background:rgba(0,0,0,.5); display:none; z-index:999;} .top_menu{top:45px; bottom:0; width:100%; position: absolute; background:rgba(0,0,0,.5); display:none; z-index:999;}
.link_list{padding:0 15px; background:#f4f4f4;border-bottom:#cacaca solid 1px; position:relative;} .link_list{padding:0 15px; background:#f4f4f4;border-bottom:#cacaca solid 1px; position:relative;}
@ -280,6 +290,7 @@ input[type=radio]:checked:after{content:''; display:block; width:12px; height:12
.station_list li:after{content:''; display:block; right:0; top:50%; -webkit-transform:translate3d(0,-50%,0); border-right: #cacaca solid 1px; height:.9em; position:absolute;} .station_list li:after{content:''; display:block; right:0; top:50%; -webkit-transform:translate3d(0,-50%,0); border-right: #cacaca solid 1px; height:.9em; position:absolute;}
.station_list li:nth-child(3n):after{ display:none;} .station_list li:nth-child(3n):after{ display:none;}
.station_list li a{display: block; line-height:2.617647058823529em; text-align:center; color:#787878;} .station_list li a{display: block; line-height:2.617647058823529em; text-align:center; color:#787878;}
.station_list li a:active{background: rgba(100,100,100,.1)}
#search_station .form_title{ text-align:center;font-size: 1rem} #search_station .form_title{ text-align:center;font-size: 1rem}
#station_hisbox .title_right{display: block;height: 30px;width: 24px;padding-left: 30px;position: absolute;right: 20px} #station_hisbox .title_right{display: block;height: 30px;width: 24px;padding-left: 30px;position: absolute;right: 20px}
.icon_remove_b{background-image: url(../images/icons.png);height: 30px;width: 24px; display: block; background-position: 3px -490px; background-size: 100%;} .icon_remove_b{background-image: url(../images/icons.png);height: 30px;width: 24px; display: block; background-position: 3px -490px; background-size: 100%;}