Skip to content

V
Vphoto
Commit da7ca0e5 by 邓丽
Options

预约按钮样式修改

parent 3311832d
Showing with 349 additions and 72 deletions
dist/css/bindDevice.min.css
@charset "UTF-8";*,:after,:before,legend{-webkit-box-sizing:border-box}a,body{color:#353535}.icon:before,a{text-decoration:none}.cover img{width:100%;height:100%;object-fit:cover;object-position:center}*,:after,:before{box-sizing:border-box}html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{font-family:"PingFang SC","Helvetica Neue",Helvetica,STHeiTi,sans-serif;font-size:14px;line-height:1.5;word-break:break-all;background:#f4f5f9}body,h1,h2,h3,h4,h5,h6,ol,p,ul{padding:0;margin:0;font-weight:lighter}a:active,a:hover{outline-width:0;cursor:pointer}div,footer,h1,h2,h3,h4,h5,h6,header,section,span{font-size:100%}ol,ul{list-style:none}textarea{resize:none;overflow:auto}button,input,select,textarea{outline:0;border:none}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{}[type=checkbox],[type=radio]{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}.icon:before,em{font-style:normal}header,header h3 span{text-align:center;height:3.46666667rem;line-height:3.46666667rem}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}.hidden,[hidden],template{display:none}img{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}@font-face{font-family:iconFont;src:url(../fonts/iconFont.eot);src:url(../fonts/iconFont.eot?#iefix) format('eot'),url(../fonts/iconFont.woff2) format('woff2'),url(../fonts/iconFont.woff) format('woff'),url(../fonts/iconFont.ttf) format('truetype'),url(../fonts/iconFont.svg#iconFont) format('svg')}.icon:before{font-family:iconFont;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-variant:normal;font-weight:400;text-transform:none}.icon-gray:before{content:"\E001"}.icon-icon_blacktel:before{content:"\E002"}.icon-icon_donwpic:before{content:"\E003"}.icon-icon_down:before{content:"\E004"}.icon-icon_eye:before{content:"\E005"}.icon-icon_livepic:before{content:"\E006"}.icon-icon_local:before{content:"\E007"}.icon-icon_more:before{content:"\E008"}.icon-icon_order:before{content:"\E009"}.icon-icon_pen:before{content:"\E00A"}.icon-icon_people:before{content:"\E00B"}.icon-icon_person:before{content:"\E00C"}.icon-icon_picture:before{content:"\E00D"}.icon-icon_redlocal:before{content:"\E00E"}.icon-icon_redphone:before{content:"\E00F"}.icon-icon_return:before{content:"\E010"}.icon-icon_reverse_order:before{content:"\E011"}.icon-icon_right:before{content:"\E012"}.icon-icon_shop:before{content:"\E013"}.icon-icon_tel:before{content:"\E014"}.icon-icon_tex:before{content:"\E015"}.icon-icon_time:before{content:"\E016"}.icon-icon_type:before{content:"\E017"}.icon-icon_up:before{content:"\E018"}header{background:#434343}header h3{width:100%;text-align:center;margin:0 auto}header h3 .prevPage{display:inline-block;float:left;width:10%;color:red;font-size:.8rem}header h3 .share,header h3 span{display:inline-block;color:#fff}header h3 span{font-size:.96rem;width:80%}header h3 .share{float:right;width:10%;font-size:1.06666667rem}.appointment>ul{padding:0 2.66666667rem}.appointment>ul li{font-size:.8rem;height:2.77333333rem;line-height:2.77333333rem;text-align:left;display:block;clear:both}.appointment>ul li a{display:block;vertical-align:middle;font-size:.8rem}.appointment>ul li:first-child{border-bottom:1px solid #ddd}.appointment .features_intro img{width:100%}.bindEquipment{background:#fff;border:1px solid #ddd;border-left:none;border-right:none}.bindEquipment ul li a input{border:1px solid #ddd;width:7.46666667rem;height:1.22666667rem;line-height:1.22666667rem}.bindEquipment ul li a span{float:right;display:inline-block;vertical-align:middle}.bindEquipment ul li a span b{display:inline-block;font-weight:400;font-size:.69333333rem}.bindEquipment ul li a span i{display:inline-block}
@charset "UTF-8";*,:after,:before,legend{-webkit-box-sizing:border-box}a,body{color:#353535}.icon:before,a{text-decoration:none}.cover img{width:100%;height:100%;object-fit:cover;object-position:center}*,:after,:before{box-sizing:border-box}html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{font-family:"PingFang SC","Helvetica Neue",Helvetica,STHeiTi,sans-serif;font-size:14px;line-height:1.5;word-break:break-all;background:#f4f5f9}body,h1,h2,h3,h4,h5,h6,ol,p,ul{padding:0;margin:0;font-weight:lighter}a:active,a:hover{outline-width:0;cursor:pointer}div,footer,h1,h2,h3,h4,h5,h6,header,section,span{font-size:100%}ol,ul{list-style:none}textarea{resize:none;overflow:auto}button,input,select,textarea{outline:0;border:none}button,input,optgroup,select,textarea{font-family:sans-serif;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{}[type=checkbox],[type=radio]{-webkit-box-sizing:border-box;box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}.icon:before,em{font-style:normal}header,header h3 span{text-align:center;height:3.46666667rem;line-height:3.46666667rem}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}.hidden,[hidden],template{display:none}img{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}@font-face{font-family:iconFont;src:url(../fonts/iconFont.eot);src:url(../fonts/iconFont.eot?#iefix) format('eot'),url(../fonts/iconFont.woff2) format('woff2'),url(../fonts/iconFont.woff) format('woff'),url(../fonts/iconFont.ttf) format('truetype'),url(../fonts/iconFont.svg#iconFont) format('svg')}.icon:before{font-family:iconFont;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-variant:normal;font-weight:400;text-transform:none}.icon-gray:before{content:"\E001"}.icon-icon_blacktel:before{content:"\E002"}.icon-icon_donwpic:before{content:"\E003"}.icon-icon_down:before{content:"\E004"}.icon-icon_downApp:before{content:"\E005"}.icon-icon_eye:before{content:"\E006"}.icon-icon_livepic:before{content:"\E007"}.icon-icon_local:before{content:"\E008"}.icon-icon_more:before{content:"\E009"}.icon-icon_order:before{content:"\E00A"}.icon-icon_pen:before{content:"\E00B"}.icon-icon_people:before{content:"\E00C"}.icon-icon_person:before{content:"\E00D"}.icon-icon_picture:before{content:"\E00E"}.icon-icon_redlocal:before{content:"\E00F"}.icon-icon_redphone:before{content:"\E010"}.icon-icon_return:before{content:"\E011"}.icon-icon_reverse_order:before{content:"\E012"}.icon-icon_right:before{content:"\E013"}.icon-icon_shop:before{content:"\E014"}.icon-icon_tel:before{content:"\E015"}.icon-icon_tex:before{content:"\E016"}.icon-icon_time:before{content:"\E017"}.icon-icon_type:before{content:"\E018"}.icon-icon_up:before{content:"\E019"}header{background:#434343}header h3{width:100%;text-align:center;margin:0 auto}header h3 .prevPage{display:inline-block;float:left;width:10%;color:red;font-size:.8rem}header h3 .share,header h3 span{display:inline-block;color:#fff}header h3 span{font-size:.96rem;width:80%}header h3 .share{float:right;width:10%;font-size:1.06666667rem}.appointment>ul{padding:0 2.66666667rem}.appointment>ul li{font-size:.8rem;height:2.77333333rem;line-height:2.77333333rem;text-align:left;display:block;clear:both}.appointment>ul li a{display:block;vertical-align:middle;font-size:.8rem}.appointment>ul li:first-child{border-bottom:1px solid #ddd}.appointment .features_intro img{width:100%}.bindEquipment{background:#fff;border:1px solid #ddd;border-left:none;border-right:none}.bindEquipment ul li a input{border:1px solid #ddd;width:7.46666667rem;height:1.22666667rem;line-height:1.22666667rem}.bindEquipment ul li a span{float:right;display:inline-block;vertical-align:middle}.bindEquipment ul li a span b{display:inline-block;font-weight:400;font-size:.69333333rem}.bindEquipment ul li a span i{display:inline-block}
/*# sourceMappingURL=bindDevice.min.css.map */
dist/css/picture-live.min.css.map
This source diff could not be displayed because it is too large. You can view the blob instead.
dist/fonts/iconFont.eot
No preview for this file type
dist/fonts/iconFont.ttf
No preview for this file type
dist/fonts/iconFont.woff
No preview for this file type
dist/html/appoint.html
......@@ -31,7 +31,7 @@
<li role="presentation" class="active"><a href="#photographer" caria-controls="profile" role="tab" data-toggle="tab">预约摄影师</a></li>
<li role="presentation" id="shop"><a href="#equipment" aria-controls="profile" role="tab" data-toggle="tab">购买Wifi-SD卡</a></li>
</ul>
<section class="ab-content">
<section class="tab-content">
<section id="photographer" class="tab-pane active">
<!-- <div class="appointment">
<h2>预约关注直播活动摄影师 </h2>
......@@ -255,8 +255,7 @@
var _equipment=$('#equipment');
var _photographer=$('#photographer');
if(str=='equipment'){
_shop.find("a").addClass("active");
_shop.siblings("li").find("a").removeClass("active");
_shop.addClass("active").siblings("li").removeClass("active");
_equipment.css("display","block");
_photographer.css("display","none");
}
......
dist/html/picture-live.html
......@@ -166,25 +166,29 @@
</section>
<!--预约摄影师-->
<section class="appointment">
<section class="appointment" id="app">
<a href="./appoint.html">
<span class="appointUser">马上预约本场摄影师 飞兔</span>
<!--单场次预约按钮-->
<!-- <span>马上预约</span>-->
<span class="appointUser">
<i class="icon icon-icon_tel"></i>
</span>
</a>
<a href="./appoint.html#equipment">
<span class="shop">
<i class="icon icon-icon_shop"></i>
<small>购买直播设备</small>
</span>
</a>
<a >
<span class="downApp mp-download">
<i class="icon icon-icon_downApp"></i>
</span>
</a>
</section>
</article>
<script src="../../lib/hammer.js/hammer.min.js"></script>
<script src="../js/picture-live.min.js"></script>
<script>
/*切换排序方式*/
$(".latest").click(function(){
$(this).find('i').toggleClass("active");
......@@ -209,7 +213,6 @@
loading = false;
$(".weui-loadmore").removeClass("block");
if($("#live_content").find('p').length>=1){
console.log("over");
$(document.body).destroyInfinite(); //销毁滚动加载
}
......
src/img/icon/icon_downApp.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid" width="30" height="26" viewBox="0 0 30 26">
<defs>
<style>
.cls-1 {
fill: red;
fill-rule: evenodd;
}
</style>
</defs>
<path d="M29.000,26.000 C29.604,26.000 30.000,25.542 30.000,25.000 L30.000,18.000 C30.000,16.895 29.105,16.000 28.000,16.000 C26.895,16.000 26.000,16.895 26.000,18.000 L26.000,22.000 L4.000,22.000 L4.000,18.000 C4.000,16.895 3.104,16.000 2.000,16.000 C0.895,16.000 -0.000,16.895 -0.000,18.000 L-0.000,25.000 C-0.000,25.479 0.520,26.000 1.000,26.000 C1.000,26.000 29.000,26.000 29.000,26.000 ZM18.969,11.000 L16.969,11.000 L16.969,2.000 C16.969,0.895 16.073,0.000 14.969,0.000 C13.864,0.000 12.969,0.895 12.969,2.000 L12.969,11.000 L10.969,11.000 C10.577,11.000 9.674,10.906 9.282,11.300 C8.890,11.694 8.890,12.332 9.282,12.726 L14.224,18.717 C14.433,18.927 14.711,19.016 14.984,19.002 C15.258,19.016 15.536,18.927 15.745,18.717 L20.687,12.726 C21.079,12.332 21.079,11.694 20.687,11.300 C20.295,10.906 19.673,11.000 18.969,11.000 Z" class="cls-1"/>
</svg>
src/js/picture-live.js
import tab from './widget/tab.js'
import slider from './widget/layout.js'
import slider from './widget/download-app.js'
\ No newline at end of file
src/js/widget/download-app.js 0 → 100644
let downloadApp = (( $ ) => {
let Selector = {
APP: '#app',
CLOSE: '.icon-close',
DOWNLOAD_APP: '.mp-download',
OPEN_APP: '.mp-open'
}
let Url = {
DOWNLOAD_APP: {
YYB_URL : 'http://a.app.qq.com/o/simple.jsp?pkgname=me.www.mepai',
ANDROID: 'https://images.mepai.me/web/www/mepai_android.apk',
IPHONE: 'https://itunes.apple.com/cn/app/id954773545'
},
OPEN_APP: {
URL_SCHEME_PREFIX: 'mepai://page.mp/',
ANDROID_YYB_URL: '',
UNIVERSAL_LINK_HOST: 'https://m.mepai.me/'
}
}
let Useragent = {
WEIXIN: /MicroMessenger/ig,
IPHONE: /iphone/ig,
ANDROID: /android/ig,
IOS9: /OS 9/ig,
IOS8: /OS 8/ig,
QQ: /qq/ig,
WEIBO: /weibo/ig
}
var is_weixin = isUseragent(Useragent.WEIXIN);
var is_android = isUseragent(Useragent.ANDROID);
var is_iphone = isUseragent(Useragent.IPHONE);
var is_ios8 = isUseragent(Useragent.IOS8);
var is_qq = isUseragent(Useragent.QQ);
var is_weibo = isUseragent(Useragent.WEIBO);
function isUseragent ( pattern ) {
var ua = navigator.userAgent.toLowerCase();
if ( ua.search(pattern) === -1) {
return false;
}
return true;
}
function closeApp () {
$(app).css('display', 'none');
}
function getUrlScheme ( prefix ) {
var url;
var id;
var page_name;
if ( scheme_id ) {
id = scheme_id;
};
switch ( scheme_name ) {
case 'works': page_name = 'workdetail';
break;
case 'activity': page_name = 'activitydetail';
break;
case 'photographyer': page_name = 'userpage';
break;
case 'tags': page_name = 'tagdetail';
break;
case 'rank_month': page_name = 'toplist?type=wm';
break;
case 'rank_week': page_name = 'toplist?type=ww';
break;
case 'rank_day': page_name = 'toplist?type=wd';
break;
};
if ( typeof tag_name !== 'undefined' ) {
url = prefix + page_name + '?' + 'id=' + id + '&tagname=' + tag_name;
}
else if ( page_name.search(/toplist/) !== -1 ) {
url = prefix + page_name;
}
else {
url = prefix + page_name + '?' + 'id=' + id;
}
return url;
}
function openSafari () {
var html = `<div class="open-safari">
<div class="open-safari-txt">
<img src= "http://images.mepai.me/web/www/images/bg_safari@2x.png">
<span>使用浏览器打开</span>
</div>
<div class="open-safari-arrow">
<img src="http://images.mepai.me/web/www/images/arrow@2x.png">
</div>
</div>`;
$('body').append(html);
}
function openApp () {
var url;
if ( is_weixin ) {
// 微信打开
if ( is_iphone ) {
if ( is_ios8 ) {
openSafari();
}
else {
url = getUrlScheme(Url.OPEN_APP.UNIVERSAL_LINK_HOST);
}
}
else {
// 针对IOS9以下系统和安卓
openSafari();
}
}
else if ( is_qq || is_weibo) {
openSafari();
}
else {
// 其他浏览器打开
url = getUrlScheme(Url.OPEN_APP.URL_SCHEME_PREFIX);
}
if ( url ) {
window.location = url;
};
}
function downloadApp () {
if( is_weixin ) {
window.location = Url.DOWNLOAD_APP.YYB_URL;
}
else if ( is_iphone ) {
window.location = Url.DOWNLOAD_APP.IPHONE;
}
else if ( is_android ) {
window.location = Url.DOWNLOAD_APP.ANDROID;
}
}
function init () {
var app = $(Selector.APP);
var timer;
// close app
app.on('click', Selector.CLOSE, closeApp);
// open app
app.on('click', Selector.OPEN_APP, openApp);
// download app
app.on('click', Selector.DOWNLOAD_APP, downloadApp)
}
init();
})( jQuery );
src/less/iconfont/iconfont.less
......@@ -37,83 +37,87 @@
content: "\E004";
}
.icon-icon_eye:before {
.icon-icon_downApp:before {
content: "\E005";
}
.icon-icon_livepic:before {
.icon-icon_eye:before {
content: "\E006";
}
.icon-icon_local:before {
.icon-icon_livepic:before {
content: "\E007";
}
.icon-icon_more:before {
.icon-icon_local:before {
content: "\E008";
}
.icon-icon_order:before {
.icon-icon_more:before {
content: "\E009";
}
.icon-icon_pen:before {
.icon-icon_order:before {
content: "\E00A";
}
.icon-icon_people:before {
.icon-icon_pen:before {
content: "\E00B";
}
.icon-icon_person:before {
.icon-icon_people:before {
content: "\E00C";
}
.icon-icon_picture:before {
.icon-icon_person:before {
content: "\E00D";
}
.icon-icon_redlocal:before {
.icon-icon_picture:before {
content: "\E00E";
}
.icon-icon_redphone:before {
.icon-icon_redlocal:before {
content: "\E00F";
}
.icon-icon_return:before {
.icon-icon_redphone:before {
content: "\E010";
}
.icon-icon_reverse_order:before {
.icon-icon_return:before {
content: "\E011";
}
.icon-icon_right:before {
.icon-icon_reverse_order:before {
content: "\E012";
}
.icon-icon_shop:before {
.icon-icon_right:before {
content: "\E013";
}
.icon-icon_tel:before {
.icon-icon_shop:before {
content: "\E014";
}
.icon-icon_tex:before {
.icon-icon_tel:before {
content: "\E015";
}
.icon-icon_time:before {
.icon-icon_tex:before {
content: "\E016";
}
.icon-icon_type:before {
.icon-icon_time:before {
content: "\E017";
}
.icon-icon_up:before {
.icon-icon_type:before {
content: "\E018";
}
.icon-icon_up:before {
content: "\E019";
}
\ No newline at end of file
src/less/picture-live.less
......@@ -6,7 +6,7 @@
@import "./ui-widget/dynamic.less";
@import "./ui-widget/nav-tabs.less";
@import "./ui-widget/layout.less";
@import "./ui-widget/mp-app-download.less";
body{
position: relative;
}
......@@ -247,13 +247,12 @@ nav{
}
#meet_room{
position: fixed;
.px1rem(bottom,105);
/*.px1rem(left,0);*/
.px1rem(bottom,0);
.px1rem(max-width,750);
overflow-x: scroll;
overflow-y: hidden;
background: #666;
/* .px1rem(min-width,750);*/
.px1rem(height,160);
ul{
width: 100%;
display: inline-block;
......@@ -307,40 +306,54 @@ nav{
.appointment{
position: fixed;
/* .px1rem(left,0);*/
.px1rem(bottom,0);
.px1rem(width,750);
.px1rem(right,30);
.px1rem(bottom,180);
z-index: 100;
.px1rem(width,90);
a{
display: block;
.px1rem(width,86);
.px1rem(height,86);
.px1rem(margin-bottom,30);
}
span{
display: block;
float: left;
.px1rem(margin-bottom,30);
.px1rem(width,86);
.px1rem(height,86);
border-radius: 50%;
background: @bg-white;
box-shadow:0px 0px 8px #bbb;
i{
color: @bg-red;
.px1rem(font-size,72);
.px1rem(margin-top,-28);
.px1rem(margin-left,28);
display: inline-block;
text-align: center;
}
}
.appointUser{
width: 70%;
background: @txt-red;
color: @txt-white;
.px1rem(font-size,36);
font-weight:lighter;
.text-center(100);
}
.shop{
width:30%;
background: @txt-light-grey;
color: #e4e4e4;
text-align: center;
.px1rem(height,100);
overflow: hidden;
i{
display: inline-block;
.px1rem(font-size,80);
.px1rem(margin-top,-5);
.px1rem(line-height,40);
}
small{
display: block;
.px1rem(line-height,50);
.px1rem(margin-top,10);
.px1rem(margin-top,-38);
.px1rem(margin-left,28);
}
}
.shop{
i{
.px1rem(font-size,72);
.px1rem(margin-top,-28);
.px1rem(margin-left,26);
}
}
.downApp{
i{
.px1rem(font-size,100);
.px1rem(margin-top,-68);
.px1rem(margin-left,30);
}
}
}
.weui-pull-to-refresh__layer,
......
src/less/ui-widget/mp-app-download.less 0 → 100644
.mp-app-download {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
z-index: 200;
background: rgba(0, 0, 0, 0.5);
color: #fff;
.px1rem(height, 100);
.mp-download-info,
.mp-download-btn {
position: absolute;
top: 50%;
transform: translateY(-50%);
}
.mp-download-info {
.px1rem(left, 24);
line-height: 1;
.px1rem(font-size, 20);
}
.mp-icon {
vertical-align: middle;
img {
.px1rem(width, 64);
}
.px1rem(margin-right, 20);
}
.mp-download-btn {
.px1rem(right, 24);
line-height: 0;
.px1rem(font-size, 24);
.btn {
.px1rem(margin-right, 4.8);
.px1rem(width, 124);
.px1rem(height, 60);
.px1rem(line-height, 60);
text-align: center;
background: #327a8c;
.px1rem(border-radius, 8);
color: #fff;
}
}
> div > div, > div > a {
display: inline-block;
}
.icon-close {
.px1rem(font-size, 50);
.px1rem(width, 20);
.px1rem(height, 40);
}
}
.open-safari {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
}
.open-safari-txt {
position: absolute;
.px1rem(top, 266);
.px1rem(right, 78);
color: #fff;
.px1rem(font-size, 30);
}
.open-safari-txt img {
.px1rem(width, 358);
.px1rem(height, 78);
}
.open-safari-txt span {
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 20%;
}
.open-safari-arrow {
position: absolute;
.px1rem(top, 46);
.px1rem(right, 44)
}
.open-safari-arrow img {
.px1rem(width, 162);
.px1rem(height, 200);
}
src/pages/appoint.ejs
......@@ -11,7 +11,7 @@
<li role="presentation" class="active"><a href="#photographer" caria-controls="profile" role="tab" data-toggle="tab">预约摄影师</a></li>
<li role="presentation" id="shop"><a href="#equipment" aria-controls="profile" role="tab" data-toggle="tab">购买Wifi-SD卡</a></li>
</ul>
<section class="ab-content">
<section class="tab-content">
<section id="photographer" class="tab-pane active">
<!-- <div class="appointment">
<h2>预约关注直播活动摄影师 </h2>
......@@ -220,8 +220,7 @@
var _equipment=$('#equipment');
var _photographer=$('#photographer');
if(str=='equipment'){
_shop.find("a").addClass("active");
_shop.siblings("li").find("a").removeClass("active");
_shop.addClass("active").siblings("li").removeClass("active");
_equipment.css("display","block");
_photographer.css("display","none");
}
......
src/pages/picture-live.ejs
......@@ -146,25 +146,29 @@
</section>
<!--预约摄影师-->
<section class="appointment">
<section class="appointment" id="app">
<a href="./appoint.html">
<span class="appointUser">马上预约本场摄影师 飞兔</span>
<!--单场次预约按钮-->
<!-- <span>马上预约</span>-->
<span class="appointUser">
<i class="icon icon-icon_tel"></i>
</span>
</a>
<a href="./appoint.html#equipment">
<span class="shop">
<i class="icon icon-icon_shop"></i>
<small>购买直播设备</small>
</span>
</a>
<a >
<span class="downApp mp-download">
<i class="icon icon-icon_downApp"></i>
</span>
</a>
</section>
</article>
<script src="../../lib/hammer.js/hammer.min.js"></script>
<script src="../js/picture-live.min.js"></script>
<script>
/*切换排序方式*/
$(".latest").click(function(){
$(this).find('i').toggleClass("active");
......@@ -189,7 +193,6 @@
loading = false;
$(".weui-loadmore").removeClass("block");
if($("#live_content").find('p').length>=1){
console.log("over");
$(document.body).destroyInfinite(); //销毁滚动加载
}
......
src/pages/template/mp-app-download.ejs 0 → 100644
<div class="mp-app-download" id="app">
<div class="mp-download-info">
<div class="mp-icon"><img src="../img/icon@2x.png"></div>
<div class="mp-ad">米拍 新青年摄影聚集地</div>
</div>
<div class="mp-download-btn">
<a href="javascript:;" class="btn mp-download">下载APP</a>
<a href="javascript:;" class="btn mp-open">打开APP</a>
<div class="icon icon-close"></div>
</div>
</div>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment