Skip to content

libai / new-yabo

Go to a project
Commit ab69ede9 by libai
Options

测试

parent b87d188e
Expand all
Inline Side-by-side
Showing with 1123 additions and 210 deletions
css/indexLi.css
......@@ -566,8 +566,9 @@ img {
}
.home-box-right-content-li3 .home-li-span {
position: absolute;
right: 3px;
left: 57px;
top: 4px;
width: 350px;
}
.home-box-right-content-li3 .home-li-ul {
height: 640px;
......
css/indexLi.less
......@@ -579,8 +579,9 @@ img {
}
.home-li-span{
position: absolute;
right: 3px;
left: 57px;
top: 4px;
width: 350px;
}
.home-li-ul{
height: 640px;
......
css/rech.css
......@@ -31,6 +31,7 @@
.rech-login img {
width: 60px;
border-radius: 50%;
vertical-align: middle;
}
.rech-login input {
width: 420px;
......@@ -226,6 +227,7 @@
.face-ck img {
width: 50px;
border-radius: 50%;
vertical-align: middle;
}
.face-ck span {
line-height: 50px;
......
demo.html 0 → 100644
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>微信登录</title>
<link href="../images/wei-icon.ico" rel="Shortcut Icon">
<style>
#login_container{
margin: 0 auto;
margin-top: 100px;
width: 500px;
text-align: center;
}
</style>
</head>
<body style="background: #1D1D1D">
<div id="login_container">
</div>
<script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
<script src="../lib/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
//id和scope不用改、appid和redirect_uri改为自己的
var obj = new WxLogin({
id:"login_container",
appid: "wx4950f49317cb9614",
scope: "snsapi_login",
redirect_uri:"http://yabolive.com",
state: "",
style: "white",
href: ""
});
</script>
</body>
</html>
demo2.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<a href="javascript:;" onclick="return window.open('https://graph.qq.com/oauth2.0/authorize?client_id=101433135&amp;response_type=token&amp;scope=all&amp;redirect_uri=http%3A%2F%2Fqzonestyle.gtimg.cn%2Fqzone%2Fopenapi%2Fredirect-1.0.1.html', 'oauth2Login_10974' ,'height=525,width=585, toolbar=no, menubar=no, scrollbars=no, status=no, location=yes, resizable=yes');"><div style="width: 500px;height: 500px;background: pink;"></div></a>
</body>
<script type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/openapi/qc_loader.js" data-appid="101433135" charset="utf-8"></script>
<script>
QC.Login({
//btnId：插入按钮的节点id，必选
btnId:"qqLoginBtn",
//用户需要确认的scope授权项，可选，默认all
scope:"all",
//按钮尺寸，可用值[A_XL| A_L| A_M| A_S| B_M| B_S| C_S]，可选，默认B_S
size: "B_S"
}, function(reqData, opts){//登录成功
//根据返回数据，更换按钮显示状态方法
console.log(reqData);//查看返回数据
QC.Login.getMe(function(openId, accessToken){//获取用户的openId
console.log('QQOPENID:'+openId);
thirdparty(null,null,reqData.figureurl_qq_2,reqData.nickname,1,openId);
QC.Login.signOut();//退出QQ登录调用事件
});
}
);
</script>
</html>
\ No newline at end of file
index.html
......@@ -178,114 +178,24 @@
<div class="home-li-top">
<h2 class="home-li-h2">周星</h2>
<div class="home-li-span star">
<span class="home-li-act">玫瑰花 · </span>
<span>亲一个 · </span>
<span>情书 · </span>
<span>烟花炮</span>
<!--<span class="home-li-act">玫瑰花 · </span>-->
<!--<span>亲一个 · </span>-->
<!--<span>情书 · </span>-->
<!--<span>烟花炮</span>-->
</div>
</div>
<ul class="home-li-ul star-ul">
<li>
<span class="home-li-wins"><img src="images/m1.png" alt=""></span>
<span class="home-li-face"><img
src="https://zhibocdn.yabolive.net/comm/user/img/742100/7e9aaf45f4f3495e8f4352878d972642.jpg?x-oss-process=image/resize,w_100"
alt=""></span>
<span class="home-li-name">
<p class="home-li-nick">巴斯小胖墩 <img src="https://zhibocdn.lvdou66.com/comm/level/28.png"
alt=""></p>
<p class="home-li-id">5943400</p>
</span>
</li>
<li>
<span class="home-li-wins"><img src="images/m2.png" alt=""></span>
<span class="home-li-face"><img
src="https://zhibocdn.yabolive.net/comm/user/img/742100/7e9aaf45f4f3495e8f4352878d972642.jpg?x-oss-process=image/resize,w_100"
alt=""></span>
<span class="home-li-name">
<p class="home-li-nick">巴斯小胖墩 <img src="https://zhibocdn.lvdou66.com/comm/level/21.png" alt=""></p>
<p class="home-li-id">5943400</p>
</span>
</li>
<li>
<span class="home-li-wins"><img src="images/m3.png" alt=""></span>
<span class="home-li-face"><img
src="https://zhibocdn.yabolive.net/comm/user/img/742100/7e9aaf45f4f3495e8f4352878d972642.jpg?x-oss-process=image/resize,w_100"
alt=""></span>
<span class="home-li-name">
<p class="home-li-nick">巴斯小胖墩 <img src="https://zhibocdn.lvdou66.com/comm/level/21.png" alt=""></p>
<p class="home-li-id">5943400</p>
</span>
</li>
<li>
<span class="home-li-wins">4</span>
<span class="home-li-face"><img
src="https://zhibocdn.yabolive.net/comm/user/img/742100/7e9aaf45f4f3495e8f4352878d972642.jpg?x-oss-process=image/resize,w_100"
alt=""></span>
<span class="home-li-name">
<p class="home-li-nick">巴斯小胖墩 <img src="https://zhibocdn.lvdou66.com/comm/level/21.png" alt=""></p>
<p class="home-li-id">5943400</p>
</span>
</li>
<li>
<span class="home-li-wins">5</span>
<span class="home-li-face"><img
src="https://zhibocdn.yabolive.net/comm/user/img/742100/7e9aaf45f4f3495e8f4352878d972642.jpg?x-oss-process=image/resize,w_100"
alt=""></span>
<span class="home-li-name">
<p class="home-li-nick">巴斯小胖墩 <img src="https://zhibocdn.lvdou66.com/comm/level/21.png" alt=""></p>
<p class="home-li-id">5943400</p>
</span>
</li>
<li>
<span class="home-li-wins">5</span>
<span class="home-li-face"><img
src="https://zhibocdn.yabolive.net/comm/user/img/742100/7e9aaf45f4f3495e8f4352878d972642.jpg?x-oss-process=image/resize,w_100"
alt=""></span>
<span class="home-li-name">
<p class="home-li-nick">巴斯小胖墩 <img src="https://zhibocdn.lvdou66.com/comm/level/21.png" alt=""></p>
<p class="home-li-id">5943400</p>
</span>
</li>
<li>
<span class="home-li-wins">5</span>
<span class="home-li-face"><img
src="https://zhibocdn.yabolive.net/comm/user/img/742100/7e9aaf45f4f3495e8f4352878d972642.jpg?x-oss-process=image/resize,w_100"
alt=""></span>
<span class="home-li-name">
<p class="home-li-nick">巴斯小胖墩 <img src="https://zhibocdn.lvdou66.com/comm/level/21.png" alt=""></p>
<p class="home-li-id">5943400</p>
</span>
</li>
<li>
<span class="home-li-wins">5</span>
<span class="home-li-face"><img
src="https://zhibocdn.yabolive.net/comm/user/img/742100/7e9aaf45f4f3495e8f4352878d972642.jpg?x-oss-process=image/resize,w_100"
alt=""></span>
<span class="home-li-name">
<p class="home-li-nick">巴斯小胖墩 <img src="https://zhibocdn.lvdou66.com/comm/level/21.png" alt=""></p>
<p class="home-li-id">5943400</p>
</span>
</li>
<li>
<span class="home-li-wins">5</span>
<span class="home-li-face"><img
src="https://zhibocdn.yabolive.net/comm/user/img/742100/7e9aaf45f4f3495e8f4352878d972642.jpg?x-oss-process=image/resize,w_100"
alt=""></span>
<span class="home-li-name">
<p class="home-li-nick">巴斯小胖墩 <img src="https://zhibocdn.lvdou66.com/comm/level/21.png" alt=""></p>
<p class="home-li-id">5943400</p>
</span>
</li>
<li>
<span class="home-li-wins">5</span>
<span class="home-li-face"><img
src="https://zhibocdn.yabolive.net/comm/user/img/742100/7e9aaf45f4f3495e8f4352878d972642.jpg?x-oss-process=image/resize,w_100"
alt=""></span>
<span class="home-li-name">
<p class="home-li-nick">巴斯小胖墩 <img src="https://zhibocdn.lvdou66.com/comm/level/21.png" alt=""></p>
<p class="home-li-id">5943400</p>
</span>
</li>
<!--<li>-->
<!--<span class="home-li-wins"><img src="images/m1.png" alt=""></span>-->
<!--<span class="home-li-face"><img-->
<!--src="https://zhibocdn.yabolive.net/comm/user/img/742100/7e9aaf45f4f3495e8f4352878d972642.jpg?x-oss-process=image/resize,w_100"-->
<!--alt=""></span>-->
<!--<span class="home-li-name">-->
<!--<p class="home-li-nick">巴斯小胖墩 <img src="https://zhibocdn.lvdou66.com/comm/level/28.png"-->
<!--alt=""></p>-->
<!--<p class="home-li-id">5943400</p>-->
<!--</span>-->
<!--</li>-->
</ul>
</div>
<div class="home-box-right-content-li4">
......@@ -318,6 +228,7 @@
$ip="http://test.api.lvdou66.com/";
cdn="https://zhibocdn.lvdou66.com/comm";
//登录后获取信息
if($.cookie("ukk")!=undefined){
$.ajax({
url:$ip+"weblive/myinfo.html",
......@@ -797,33 +708,5 @@
}
});
// 家族榜
// function IsLoad(_url){
// $.ajax({
// url:_url,
// type:"get",
// success:function(msg){
// alert(1)
// console.log(msg)
// //说明请求的url存在，并且可以访问
// if($.isFunction(fun)){
// fun(true);
// }
// },
// error: function (msg) {
// console.log(msg)
// },
// statusCode:{
// 404:function(msg){
// alert(1)
// console.log(msg)
// //说明请求的url不存在
// if($.isFunction(fun)){
// fun(false);
// }
// }
// }
// });
// }
</script>
</html>
\ No newline at end of file
pop/login.html
......@@ -8,33 +8,33 @@
<link rel="stylesheet" href="../css/layer.css">
</head>
<body>
<!--登录部分-->
<div class="pop-box pop-login">
<div class="pop-top"></div>
<div class="pop-content">
<div class="pop-content-box">
<div class="pop-l">
<div class="phone-box">
<label for="phone-code">+86</label>
<input type="text" id="phone-code" onkeyup="value=value.replace(/[^\d]/g,'')" maxlength="11" placeholder="请输入手机号">
</div>
<div class="pwd-box">
<label for="pwd-code">密码</label>
<input type="password" id="pwd-code" maxlength="16" placeholder="请输入密码">
</div>
<div class="pop-l-bottom">
<p class="pop-r-topText"><span class="Forgotten">忘记密码</span><span class="No-account">还没有账号？<span class="reg-text">立即注册</span></span></p>
<button style="margin-top:45px ;" class="login-btn login-btn1">确定</button>
<p class="login-text">登录即表示同意<span class="protocol">用户协议</span></p>
</div>
<!--登录部分-->
<div class="pop-box pop-login">
<div class="pop-top"></div>
<div class="pop-content">
<div class="pop-content-box">
<div class="pop-l">
<div class="phone-box">
<label for="phone-code">+86</label>
<input type="text" id="phone-code" onkeyup="value=value.replace(/[^\d]/g,'')" maxlength="11" placeholder="请输入手机号">
</div>
<div class="pop-r">
<div class="download-box">
<img class="down-img" src="../images/downloadCode.png" alt="">
<img class="down-ping" src="../images/header-logo.png" alt="">
</div>
<p class="down-text">扫码下载丫播APP</p>
<div class="more-login-box">
<div class="pwd-box">
<label for="pwd-code">密码</label>
<input type="password" id="pwd-code" maxlength="16" placeholder="请输入密码">
</div>
<div class="pop-l-bottom">
<p class="pop-r-topText"><span class="Forgotten">忘记密码</span><span class="No-account">还没有账号？<span class="reg-text">立即注册</span></span></p>
<button style="margin-top:45px ;" class="login-btn login-btn1">确定</button>
<p class="login-text">登录即表示同意<span class="protocol">用户协议</span></p>
</div>
</div>
<div class="pop-r">
<div class="download-box">
<img class="down-img" src="../images/downloadCode.png" alt="">
<img class="down-ping" src="../images/header-logo.png" alt="">
</div>
<p class="down-text">扫码下载丫播APP</p>
<div class="more-login-box">
<span>
<img src="../images/qqLogin.png" alt="">
<span class="qq-text">QQ登录</span>
......@@ -44,46 +44,46 @@
<span class="weixin-text">微信登录</span>
</span>
</div>
</div>
</div>
</div>
</div>
<!--找回密码部分-->
<div class="pop-box pop-psd" style="display: none">
<div class="pop-top"></div>
<div class="pop-content">
<div class="pop-content-box">
<div class="pop-l">
<div class="phone-box">
<label for="phone-code2">+86</label>
<input type="text" id="phone-code2" onkeyup="value=value.replace(/[^\d]/g,'')" maxlength="11" placeholder="请输入手机号">
</div>
<div class="phone-box">
<label for="phone-Verification">验 证 码</label>
<input type="text" id="phone-Verification" placeholder="请输入验证码">
<button class="get-code">获取验证码</button>
</div>
<div class="phone-box">
<label for="new-pwd">新 密 码</label>
<input type="password" id="new-pwd" placeholder="请输入新密码">
</div>
<div class="phone-box">
<label for="new-pwd2">确认密码</label>
<input type="password" id="new-pwd2" placeholder="请再次输入新密码">
</div>
<div class="pop-l-bottom">
<button class="login-btn login-btn2">确定</button>
</div>
</div>
<!--找回密码部分-->
<div class="pop-box pop-psd" style="display: none">
<div class="pop-top"></div>
<div class="pop-content">
<div class="pop-content-box">
<div class="pop-l">
<div class="phone-box">
<label for="phone-code2">+86</label>
<input type="text" id="phone-code2" onkeyup="value=value.replace(/[^\d]/g,'')" maxlength="11" placeholder="请输入手机号">
</div>
<div class="phone-box">
<label for="phone-Verification">验 证 码</label>
<input type="text" id="phone-Verification" placeholder="请输入验证码">
<button class="get-code">获取验证码</button>
</div>
<div class="pop-r">
<div class="download-box">
<img class="down-img" src="../images/downloadCode.png" alt="">
<img class="down-ping" src="../images/header-logo.png" alt="">
</div>
<p class="down-text">扫码下载丫播APP</p>
<div class="more-login-box">
<div class="phone-box">
<label for="new-pwd">新 密 码</label>
<input type="password" id="new-pwd" placeholder="请输入新密码">
</div>
<div class="phone-box">
<label for="new-pwd2">确认密码</label>
<input type="password" id="new-pwd2" placeholder="请再次输入新密码">
</div>
<div class="pop-l-bottom">
<button class="login-btn login-btn2">确定</button>
</div>
</div>
<div class="pop-r">
<div class="download-box">
<img class="down-img" src="../images/downloadCode.png" alt="">
<img class="down-ping" src="../images/header-logo.png" alt="">
</div>
<p class="down-text">扫码下载丫播APP</p>
<div class="more-login-box">
<span>
<img src="../images/qqLogin.png" alt="">
<span class="qq-text">QQ登录</span>
......@@ -92,11 +92,11 @@
<img src="../images/weixinLogin.png" alt="">
<span class="weixin-text">微信登录</span>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
<script src="../lib/jquery-3.1.1.min.js"></script>
<script src="../layer-v3.1.0/layer/layer.js"></script>
......@@ -252,11 +252,11 @@
var data=JSON.parse(msg);
console.log(data);
if(data.code==1){
layer.msg("更改成功！")
setTimeout(function () {
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
},1000)
layer.msg("更改成功！")
setTimeout(function () {
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
},1000)
}else{
layer.msg(data.msg);
}
......
pop/pay.html
......@@ -58,11 +58,57 @@
<script src="../lib/jquery-3.1.1.min.js"></script>
<script src="../layer-v3.1.0/layer/layer.js"></script>
<script src="../lib/qrcode.min.js"></script>
<script src="../lib/jquery.cookie.js"></script>
<script>
var $ip="http://pay.ishuaji.cn";
var moneykey=false;
var paykey=false;
var p1=null;
if($.cookie("ukk")!=undefined){
$(".rech-inp").val($.cookie("ukk"));
uid=$(".rech-inp").val();
$.ajax({
url:$ip+"/user/info/"+uid,
dataType:"json",
type:"get",
success: function (msg) {
// console.log(msg);
if(msg.code==1){
nickname=msg.nickname;
face=msg.face;
var html=[];
html+='<p class="rech-sos"></p>';
html+='<p class="rech-nicheng">';
html+="<img src='http://zhibocdn.ishuaji.cn/comm"+msg.face+"?x-oss-process=image/resize,h_100,w_100'/><span>"+msg.nickname+"</span>";
html+='</p>';
$(".rech-msg").html(html);
var htmlb=[];
htmlb+='<button class="rech-nextok">下一步</button>';
$(".rech-btn").html(htmlb);
$(".rech-nextok").on("click", function () {
$(".rech-nav").children("li").removeClass("navact");
$(".rech-nav").children().eq(1).addClass("navact");
loding ();
});
}
else{
var html2=[];
html2+='<p class="rech-sos">您输入的Yabo有误，请确认后重新输入</p>';
html2+='<p class="rech-nicheng"><img src="../images/rechlogo.png" alt="丫播头像"/><span>丫播YaboLive昵称</span></p>';
$(".rech-msg").html(html2);
$(".rech-inp").val("");
}
// <p class="rech-txt">丫播YaboLive账号验证</p>
// <input class="rech-inp" type="text" placeholder="请输入您的Yabo ID"/>
// <p class="rech-sos"></p>
// <p class="rech-nicheng"><img src="../images/rechlogo.png" alt="丫播头像"/><span>丫播YaboLive昵称</span></p>
}
// http://zhibocdn.ishuaji.cn/comm/user/img/7878549/f859ccbcce5b4a728c79cdc6844f10d9.jpg?x-oss-process=image/resize,h_100,w_100
})
}
$(".rech-inp").on("keydown", function () {
if(event.keyCode == "13"){
$(this).blur();
......
recharge/css/base.css 0 → 100644
/*初始化 reset*/
@charset "utf-8";
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,input,button,textarea,select,p,span,font,em,i,b,strong,button{margin:0;padding:0;}
body{margin:0;font-family:"Microsoft YaHei",Arial,Helvetica,sans-serif,"宋体"; background:#fff; overflow:visible; color:#333333;}
html, body { height: 100%;}
input,select{font-size:12px;line-height:16px; border:0 none; vertical-align:middle;}
button{ border:0 none;}
.clear{clear:both;padding:0px;margin:0px;}
img{border:0;}
a {outline: none;}
a:active {star:expression(this.onFocus=this.blur());}
a:focus { outline:0; }
input,button,select,textarea{outline:none}
ul,li{list-style-type:none;_list-style:outside;}
a{ text-decoration:none; color:#333;}
a:hover{ color:#ff6600;}
/* new clearfix清除浮动 */
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}
.clearfix { display: block;zoom:1 }
* html .clearfix {height: 1%; zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
html[xmlns] .clearfix { display: block; zoom:1}
/*清除浮动-end*/
h1,h2,h3,h4,h5,h6{font-weight: normal}
/*这一句是用来解决在安卓上的点击出现篮框问题*/
body{ -webkit-tap-highlight-color:rgba(0,0,0,0); }
/*下面是解决ios上去除微信点击蓝色边框 */
a:focus,
input:focus,
p:focus,
div:focus{
-webkit-tap-highlight-color:rgba(0,0,0,0);
-webkit-user-modify:read-only;
}
/*清除浮动*/
.w{
width: 1200px;
margin: 0 auto;
}
button{
cursor: pointer;
outline:none;
}
input[type=number] {
-moz-appearance:textfield;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
::-webkit-scrollbar{
display:none;
}
/*版芯*/
\ No newline at end of file
recharge/css/index.css 0 → 100644
.bg {
width: 10rem;
margin: 0 auto;
}
.top-text {
text-align: center;
font-size: 0.45rem;
margin-bottom: 0.1rem;
}
.top-num {
text-align: center;
font-size: 0.55rem;
font-weight: 700;
}
.top-box {
padding-top: 0.9rem;
}
.content {
width: 9.3rem;
margin: 0 auto;
margin-top: 0.9rem;
}
.content li {
position: relative;
height: 2.1rem;
width: 4.2rem;
border-radius: 0.1rem;
border: 1px solid #E8E8E8;
box-sizing: border-box;
float: left;
margin-left: 0.2rem;
margin-right: 0.2rem;
margin-bottom: 0.4rem;
}
.content .li-click {
background: url("../images/select.png") no-repeat;
background-size: 100% 100%;
border: 1px solid #fff;
}
.diamond-p {
text-align: center;
font-size: 0.35rem;
margin-top: 0.55rem;
}
.diamond-p img {
vertical-align: middle;
margin-top: -0.1rem;
width: 0.4rem;
}
.money-p {
text-align: center;
font-size: 0.45rem;
font-weight: 500;
margin-top: 0.1rem;
}
.hot {
position: absolute;
width: 0.87rem;
top: -0.3rem;
left: -0.3rem;
}
.pay-box {
width: 8.75rem;
margin: 0 auto;
margin-top: 0.3rem;
}
.pay-box .pay-tips {
font-size: 0.32rem;
color: #333333;
}
.pay-ul {
margin-top: 0.25rem;
}
.pay-ul li {
width: 2.68rem;
height: 1rem;
float: left;
border-radius: 0.1rem;
margin-right: 0.3rem;
border: 1px solid #E8E8E8;
text-align: center;
line-height: 1rem;
font-size: 0.4rem;
}
.pay-ul li img {
width: 0.5rem;
vertical-align: middle;
margin-top: -0.07rem;
}
.pay-ul .pay-click {
background: url("../images/pay-click.png") no-repeat;
background-size: 100% 100%;
border: 1px solid #fff;
}
.taobao-Pay {
width: 8.75rem;
margin: 0 auto;
height: 0.85rem;
line-height: 0.85rem;
font-size: 0.32rem;
margin-top: 0.3rem;
border-radius: 0.1rem;
border: 0.02rem solid #E8E8E8;
}
.taobao-Pay img {
height: 0.35rem;
vertical-align: middle;
margin-top: -0.05rem;
}
.pay-btn {
height: 1.25rem;
width: 7.55rem;
margin-left: 1.23rem;
color: #ffffff;
font-size: 0.4rem;
margin-top: 0.4rem;
background: linear-gradient(to right, #ff8d00, #ff5200);
box-shadow: 0rem 0.1rem 0.1rem #FFDFCD;
border-radius: 1rem;
}
.b-tips {
width: 7.5rem;
margin: 0 auto;
font-size: 0.3rem;
margin-top: 0.7rem;
text-align: center;
line-height: 0.5rem;
}
.b-tips img {
width: 1.55rem;
vertical-align: middle;
margin-top: -0.07rem;
}
recharge/css/index.less 0 → 100644
.bg{
width: 10rem;
margin: 0 auto;
}
.top-text{
text-align: center;
font-size: 0.45rem;
margin-bottom: 0.1rem;
}
.top-num{
text-align: center;
font-size: 0.55rem;
font-weight: 700;
}
.top-box{
padding-top: 0.9rem;
}
.content{
width: 9.3rem;
margin: 0 auto;
margin-top: 0.9rem;
li{
position: relative;
height: 2.1rem;
width: 4.2rem;
border-radius: 0.1rem;
border: 1px solid #E8E8E8;
box-sizing: border-box;
float: left;
margin-left: 0.2rem;
margin-right: 0.2rem;
margin-bottom: 0.4rem;
}
.li-click{
background: url("../images/select.png")no-repeat;
background-size: 100% 100%;
border: 1px solid #fff;
}
}
.diamond-p{
text-align: center;
font-size: 0.35rem;
margin-top: 0.55rem;
img{
vertical-align: middle;
margin-top: -0.1rem;
width: 0.4rem;
}
}
.money-p{
text-align: center;
font-size: 0.45rem;
font-weight: 500;
margin-top: 0.1rem;
}
.hot{
position: absolute;
width: 0.87rem;
top: -0.3rem;
left: -0.3rem;
}
.pay-box{
width: 8.75rem;
margin: 0 auto;
margin-top: 0.3rem;
.pay-tips{
font-size: 0.32rem;
color: #333333;
}
}
.pay-ul{
margin-top: 0.25rem;
li{
width: 2.68rem;
height: 1rem;
float: left;
border-radius: 0.1rem;
margin-right: 0.3rem;
border: 1px solid #E8E8E8;
text-align: center;
line-height: 1rem;
font-size: 0.4rem;
img{
width: 0.5rem;
vertical-align: middle;
margin-top: -0.07rem;
}
}
.pay-click{
background: url("../images/pay-click.png")no-repeat;
background-size: 100% 100%;
border: 1px solid #fff;
}
}
.taobao-Pay{
width: 8.75rem;
margin: 0 auto;
height: 0.85rem;
line-height: 0.85rem;
font-size: 0.32rem;
margin-top: 0.3rem;
border-radius: 0.1rem;
border: 0.02rem solid #E8E8E8;
img{
height: 0.35rem;
vertical-align: middle;
margin-top: -0.05rem;
}
}
.pay-btn{
height: 1.25rem;
width: 7.55rem;
margin-left: 1.23rem;
color: #ffffff;
font-size: 0.4rem;
margin-top: 0.4rem;
background: linear-gradient(to right, #ff8d00, #ff5200);
box-shadow: 0rem 0.1rem 0.1rem #FFDFCD;
border-radius: 1rem;
}
.b-tips{
width: 7.5rem;
margin: 0 auto;
font-size: 0.3rem;
margin-top: 0.7rem;
text-align: center;
line-height: 0.5rem;
img{
width: 1.55rem;
vertical-align: middle;
margin-top:-0.07rem;
}
}
\ No newline at end of file
recharge/css/layer.css 0 → 100644
.layui-m-layer{position:relative;z-index:19891014}.layui-m-layer *{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.layui-m-layermain,.layui-m-layershade{position:fixed;left:0;top:0;width:100%;height:100%}.layui-m-layershade{background-color:rgba(0,0,0,.7);pointer-events:auto}.layui-m-layermain{display:table;font-family:Helvetica,arial,sans-serif;pointer-events:none}.layui-m-layermain .layui-m-layersection{display:table-cell;vertical-align:middle;text-align:center}.layui-m-layerchild{position:relative;display:inline-block;text-align:left;background-color:#fff;font-size:14px;border-radius:5px;box-shadow:0 0 8px rgba(0,0,0,.1);pointer-events:auto;-webkit-overflow-scrolling:touch;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:.2s;animation-duration:.2s}@-webkit-keyframes layui-m-anim-scale{0%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes layui-m-anim-scale{0%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}.layui-m-anim-scale{animation-name:layui-m-anim-scale;-webkit-animation-name:layui-m-anim-scale}@-webkit-keyframes layui-m-anim-up{0%{opacity:0;-webkit-transform:translateY(800px);transform:translateY(800px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes layui-m-anim-up{0%{opacity:0;-webkit-transform:translateY(800px);transform:translateY(800px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.layui-m-anim-up{-webkit-animation-name:layui-m-anim-up;animation-name:layui-m-anim-up}.layui-m-layer0 .layui-m-layerchild{width:90%;max-width:640px}.layui-m-layer1 .layui-m-layerchild{border:none;border-radius:0}.layui-m-layer2 .layui-m-layerchild{width:auto;max-width:260px;min-width:40px;border:none;background:0 0;box-shadow:none;color:#fff}.layui-m-layerchild h3{padding:0 10px;height:60px;line-height:60px;font-size:16px;font-weight:400;border-radius:5px 5px 0 0;text-align:center}.layui-m-layerbtn span,.layui-m-layerchild h3{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.layui-m-layercont{padding:50px 30px;line-height:22px;text-align:center}.layui-m-layer1 .layui-m-layercont{padding:0;text-align:left}.layui-m-layer2 .layui-m-layercont{text-align:center;padding:0;line-height:0}.layui-m-layer2 .layui-m-layercont i{width:25px;height:25px;margin-left:8px;display:inline-block;background-color:#fff;border-radius:100%;-webkit-animation:layui-m-anim-loading 1.4s infinite ease-in-out;animation:layui-m-anim-loading 1.4s infinite ease-in-out;-webkit-animation-fill-mode:both;animation-fill-mode:both}.layui-m-layerbtn,.layui-m-layerbtn span{position:relative;text-align:center;border-radius:0 0 5px 5px}.layui-m-layer2 .layui-m-layercont p{margin-top:20px}@-webkit-keyframes layui-m-anim-loading{0%,100%,80%{transform:scale(0);-webkit-transform:scale(0)}40%{transform:scale(1);-webkit-transform:scale(1)}}@keyframes layui-m-anim-loading{0%,100%,80%{transform:scale(0);-webkit-transform:scale(0)}40%{transform:scale(1);-webkit-transform:scale(1)}}.layui-m-layer2 .layui-m-layercont i:first-child{margin-left:0;-webkit-animation-delay:-.32s;animation-delay:-.32s}.layui-m-layer2 .layui-m-layercont i.layui-m-layerload{-webkit-animation-delay:-.16s;animation-delay:-.16s}.layui-m-layer2 .layui-m-layercont>div{line-height:22px;padding-top:7px;margin-bottom:20px;font-size:14px}.layui-m-layerbtn{display:box;display:-moz-box;display:-webkit-box;width:100%;height:50px;line-height:50px;font-size:0;border-top:1px solid #D0D0D0;background-color:#F2F2F2}.layui-m-layerbtn span{display:block;-moz-box-flex:1;box-flex:1;-webkit-box-flex:1;font-size:14px;cursor:pointer}.layui-m-layerbtn span[yes]{color:#40AFFE}.layui-m-layerbtn span[no]{border-right:1px solid #D0D0D0;border-radius:0 0 0 5px}.layui-m-layerbtn span:active{background-color:#F6F6F6}.layui-m-layerend{position:absolute;right:7px;top:10px;width:30px;height:30px;border:0;font-weight:400;background:0 0;cursor:pointer;-webkit-appearance:none;font-size:30px}.layui-m-layerend::after,.layui-m-layerend::before{position:absolute;left:5px;top:15px;content:'';width:18px;height:1px;background-color:#999;transform:rotate(45deg);-webkit-transform:rotate(45deg);border-radius:3px}.layui-m-layerend::after{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}body .layui-m-layer .layui-m-layer-footer{position:fixed;width:95%;max-width:100%;margin:0 auto;left:0;right:0;bottom:10px;background:0 0}.layui-m-layer-footer .layui-m-layercont{padding:20px;border-radius:5px 5px 0 0;background-color:rgba(255,255,255,.8)}.layui-m-layer-footer .layui-m-layerbtn{display:block;height:auto;background:0 0;border-top:none}.layui-m-layer-footer .layui-m-layerbtn span{background-color:rgba(255,255,255,.8)}.layui-m-layer-footer .layui-m-layerbtn span[no]{color:#FD482C;border-top:1px solid #c2c2c2;border-radius:0 0 5px 5px}.layui-m-layer-footer .layui-m-layerbtn span[yes]{margin-top:10px;border-radius:5px}body .layui-m-layer .layui-m-layer-msg{width:auto;max-width:90%;margin:0 auto;bottom:-150px;background-color:rgba(0,0,0,.7);color:#fff}.layui-m-layer-msg .layui-m-layercont{padding:10px 20px}
\ No newline at end of file
recharge/index.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta content="telephone=no" name="format-detection">
<meta name="wap-font-scale" content="no">
<title>优惠充值</title>
<link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/layer.css">
<link rel="stylesheet" href="css/index.css?v='2018110101'">
<script src="lib/fsize.js"></script>
</head>
<body>
<div class="bg">
<div class="top-box">
<p class="top-text">现有橙钻</p>
<p class="top-num">--</p>
</div>
<ul class="content clearfix">
</ul>
<div class="pay-box">
<p class="pay-tips">选择支付方式</p>
<ul class="pay-ul clearfix">
<li>
<img src="images/weipay.png" alt=""> 微信支付 <i style="display: none">weipay</i>
</li>
<li>
<img src="images/alipay.png" alt=""> 支付宝 <i style="display: none">alipay</i>
</li>
</ul>
<div class="taobao-Pay"><img style="margin-left: 0.1rem;" src="images/diamond.png" alt=""> 更多大额充值<span
style="float: right;margin-right: 0.2rem;">淘宝官方企业店 <img
style="height: 0.28rem;vertical-align: middle;margin-top: -0.05rem;" src="images/right.png"
alt=""></span></div>
</div>
<div>
<button class="pay-btn">确认充值</button>
</div>
<p class="b-tips">温馨提示：关注客服公众号<span style="color: #ff6600;">"YaboLive"</span>也可以购买橙钻，充值问题可点击 <img class="call" src="images/call.png" alt=""></p>
</div>
<div class="alipay"></div>
</body>
<script src="lib/jquery-3.1.1.min.js"></script>
<script>
var $ip = "http://test.pay.ishuaji.cn";
var cdn = "http://zhibocdn.ishuaji.cn/comm";
payOk = true;
moneyBl = false;
payBl = false;
if (sessionStorage.kkk == undefined) {
var bbb = location.href;
var data = url_get_params(bbb)
sessionStorage.kkk = data.token; //t
sessionStorage.bbb = data.uid; //u
sessionStorage.cid = data.cid;
sessionStorage.pkg = data.pkg;
sessionStorage.os = data.os;
}
function url_get_params(url_path) {
var url = url_path;
var theRequest = new Object();
if (url.indexOf("?") != -1) {
var str = url.substr(url.indexOf("?") + 1);
strs = str.split("&");
for (var i = 0; i < strs.length; i++) {
theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
}
}
return theRequest;
}
$.ajax({
url:$ip+"/user/auth/"+sessionStorage.bbb+'/'+sessionStorage.kkk,
type:"post",
success: function (msg) {
var data=JSON.parse(msg);
$(".top-num").text(data.diamond)
}
})
$.ajax({
url: $ip + "/pay/normal/recharge.html",
dataType: "json",
type: "get",
success: function (msg) {
console.log(msg)
var html = [];
for (var i = 0; i < msg.data.third.length; i++) {
html += '<li>';
if (msg.data.third[i].addnum == 0) {
if(msg.data.third[i].coinnum==0) html += '<p class="diamond-p"><img src="images/diamond.png" alt="">' + msg.data.third[i].diamond + '</p>';
else html += '<p class="diamond-p"><img src="images/diamond.png" alt="">' + msg.data.third[i].diamond + '(送' + msg.data.third[i].coinnum + '银币)</p>';
} else {
html += '<p class="diamond-p"><img src="images/diamond.png" alt="">' + msg.data.third[i].diamond + '(<span style="color: #ff6600;">送' + msg.data.third[i].addnum + '橙钻</span>)</p>';
}
html += '<p class="money-p">¥<span class="pay-money">' + msg.data.third[i].amount + '</span></p>';
if (msg.data.third[i].sale == 1) {
html += '<img class="hot" src="images/hot.png" alt="">';
}
html += '</li>';
}
$(".content").html(html);
$(".content li").on("click", function () {
moneyBl = true;
$(this).addClass("li-click");
$(this).siblings("li").removeClass("li-click");
amount = $(this).children("p").children("span").text()
console.log(amount);
})
}
})
$(".pay-ul li").on("click", function () {
payBl = true;
$(this).addClass("pay-click");
$(this).siblings("li").removeClass("pay-click")
sessionStorage.pay = $(this).children("i").text()
})
$(".pay-btn").on("click", function () {
if (moneyBl && payBl) {
if (sessionStorage.pay == "alipay") {
if (payOk) {
$.ajax({
url: $ip + "/order/h5/alipay.html",
dataType: "json",
type: "get",
data: {
'uid': sessionStorage.bbb,
'amount': amount,
'pkg':sessionStorage.pkg,
'cid':sessionStorage.cid,
'os':sessionStorage.os
},
success: function (msg) {
console.log(msg);
var html = [];
payOk = true
html += msg.html;
$(".alipay").html(html);
}
})
}
} else if (sessionStorage.pay == "weipay") {
if (payOk) {
$.ajax({
url: $ip + "/order/h5/wechat.html",
dataType: "json",
type: "post",
data: {
'uid': sessionStorage.bbb,
'amount': amount,
'pkg':sessionStorage.pkg,
'cid':sessionStorage.cid,
'os':sessionStorage.os
},
success: function (msg) {
console.log(msg);
payOk = true;
window.location.href = msg.result.payInfo.url;
}
})
}
}
}
})
$(".taobao-Pay").on("click", function () {
var ua = navigator.userAgent.toLowerCase();
if (/android/.test(ua)) {
window.location.href = "https://t.asczwa.com/taobao?backurl=https://shop210574835.taobao.com/category-1352272859.htm?spm=a1z10.5-c-s.w4010-16717225808.8.3d65a6d316PtcH&search=y&catName=%A3%A8%BA%A3%CD%E2%A3%A9%CE%9E%BB%F0%CF%78%8C%9A%CA%AF#bd"
} else if (/iphone|ipad|ipod/.test(ua)) {
var obj2={
"cid": 5,
"reqCode": new Date().getTime(),
"data": {
"url": "https://t.asczwa.com/taobao?backurl=https://shop210574835.taobao.com/category-1352272859.htm?spm=a1z10.5-c-s.w4010-16717225808.8.3d65a6d316PtcH&search=y&catName=%A3%A8%BA%A3%CD%E2%A3%A9%CE%9E%BB%F0%CF%78%8C%9A%CA%AF#bd",
}
}
var obj = JSON.stringify(obj2);
appCollaboration(obj)
}
})
$(".call").on("click", function () {
var obj2 = {
"cid": 4,
"reqCode": new Date().getTime(),
"data": {
"msg": "请求客服",
}
}
var obj = JSON.stringify(obj2);
appCollaboration(obj)
})
//实现和客户端沟通
function appCollaboration(msg) {
var sUserAgent = navigator.userAgent.toLowerCase();
var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
var bIsMidp = sUserAgent.match(/midp/i) == "midp";
var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
var bIsAndroid = sUserAgent.match(/android/i) == "android";
var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
if (!(bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM)) {
}
else if (bIsAndroid) {
window.yazhai.appCollaboration(msg);
} else if (bIsIphoneOs || bIsIpad) {
window.webkit.messageHandlers.appCollaboration.postMessage(msg);
}
}
//客户端回调结果
function appCallback(msg) {
console.log(msg);
}
</script>
</html>
\ No newline at end of file
recharge/lib/fsize.js 0 → 100644
/*function setRemFontSize(baseSize, baseWidth) {
var baseSize = baseSize || 37.5,
baseWidth = baseWidth || 375,
clientWidth = document.documentElement.clientWidth <= 480 ? document.documentElement.clientWidth : 480;
document.getElementsByTagName('html')[0].style.fontSize = clientWidth * baseSize / baseWidth + 'px'
}
setRemFontSize();
window.addEventListener("resize", function() {
setTimeout(function() {
setRemFontSize();
}, 200)
});*/
!function(e,t){function i(){var t=n.getBoundingClientRect().width;t/m>540&&(t=540*m);var i=t/10;n.style.fontSize=i+"px",d.rem=e.rem=i}var a,r=e.document,n=r.documentElement,o=r.querySelector('meta[name="viewport"]'),l=r.querySelector('meta[name="flexible"]'),m=0,s=0,d=t.flexible||(t.flexible={});if(o){console.warn("将根据已有的meta标签来设置缩放比例");var p=o.getAttribute("content").match(/initial\-scale=([\d\.]+)/);p&&(s=parseFloat(p[1]),m=parseInt(1/s))}else if(l){var c=l.getAttribute("content");if(c){var u=c.match(/initial\-dpr=([\d\.]+)/),f=c.match(/maximum\-dpr=([\d\.]+)/);u&&(m=parseFloat(u[1]),s=parseFloat((1/m).toFixed(2))),f&&(m=parseFloat(f[1]),s=parseFloat((1/m).toFixed(2)))}}if(!m&&!s){var v=(e.navigator.appVersion.match(/android/gi),e.navigator.appVersion.match(/iphone/gi)),h=e.devicePixelRatio;m=v?h>=3&&(!m||m>=3)?3:h>=2&&(!m||m>=2)?2:1:1,s=1/m}if(n.setAttribute("data-dpr",m),!o)if(o=r.createElement("meta"),o.setAttribute("name","viewport"),o.setAttribute("content","initial-scale="+s+", maximum-scale="+s+", minimum-scale="+s+", user-scalable=no"),n.firstElementChild)n.firstElementChild.appendChild(o);else{var x=r.createElement("div");x.appendChild(o),r.write(x.innerHTML)}e.addEventListener("resize",function(){clearTimeout(a),a=setTimeout(i,300)},!1),e.addEventListener("pageshow",function(e){e.persisted&&(clearTimeout(a),a=setTimeout(i,300))},!1),"complete"===r.readyState?r.body.style.fontSize=12*m+"px":r.addEventListener("DOMContentLoaded",function(e){r.body.style.fontSize=12*m+"px"},!1),i(),d.dpr=e.dpr=m,d.refreshRem=i,d.rem2px=function(e){var t=parseFloat(e)*this.rem;return"string"==typeof e&&e.match(/rem$/)&&(t+="px"),t},d.px2rem=function(e){var t=parseFloat(e)/this.rem;return"string"==typeof e&&e.match(/px$/)&&(t+="rem"),t}}(window,window.lib||(window.lib={}));
\ No newline at end of file
room/css/room.css
......@@ -78,6 +78,7 @@
.box-r .box-r-top {
margin-top: 24px;
height: 506px;
position: relative;
}
.opc {
opacity: 0.5;
......@@ -310,6 +311,7 @@
}
.msg-ul {
height: 418px;
position: relative !important;
}
.gift-box {
height: 343px;
......@@ -597,3 +599,164 @@
left: 10px;
font-size: 16px !important;
}
.gift-show-box {
width: 430px;
position: absolute;
height: 310px;
overflow: hidden;
left: -500px;
padding-top: 80px;
}
.gift-show-content {
position: relative;
margin-top: 10px;
width: 358.4px;
height: 67.2px;
z-index: 550;
background: url('../images/gift/p1.png') no-repeat;
background-size: 100% 100% !important;
transition: 0.5s all;
opacity: 0;
}
.show {
opacity: 1;
}
.out {
transform: translateX(200px);
opacity: 0;
}
.gift-show-content1 {
background: url('../images/gift/p1.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content2 {
background: url('../images/gift/p2.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content3 {
background: url('../images/gift/p3.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content4 {
background: url('../images/gift/p4.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content5 {
background: url('../images/gift/p5.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content6 {
background: url('../images/gift/p6.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content7 {
background: url('../images/gift/p7.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content8 {
background: url('../images/gift/p8.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content9 {
background: url('../images/gift/p9.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content10 {
background: url('../images/gift/p10.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content11 {
background: url('../images/gift/p11.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content12 {
background: url('../images/gift/p12.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content13 {
background: url('../images/gift/p13.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content14 {
background: url('../images/gift/p14.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content15 {
background: url('../images/gift/p15.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content16 {
background: url('../images/gift/p16.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content17 {
background: url('../images/gift/p17.png') no-repeat;
background-size: 100% 100% !important;
}
.gift-show-img {
border-radius: 50%;
width: 50px;
height: 50px;
position: absolute;
top: 8px;
left: 8px;
}
.gift-show-name {
color: #FEE223;
font-size: 20px;
position: absolute;
left: 75px;
top: 8px;
}
.gift-show-gift {
color: #ffffff;
font-size: 16px;
position: absolute;
left: 75px;
top: 36px;
}
.gift-show-rich {
width: 55px;
height: 55px;
position: absolute;
left: 220px;
top: 3px;
}
.gift-show-x {
background: linear-gradient(to bottom, #FAE043, #FF6D04);
-webkit-background-clip: text;
color: transparent;
font-size: 30px;
font-weight: 700;
position: absolute;
left: 290px;
top: 14px;
}
.gift-show-num {
background: linear-gradient(to bottom, #FAE043, #FF6D04);
-webkit-background-clip: text;
color: transparent;
position: absolute;
font-size: 38px;
left: 320px;
top: 8px;
}
.gift-show-num-act {
animation: bigNum 0.4s linear;
/* Safari 和 Chrome */
-webkit-animation: bigNum 0.4s linear;
/* Safari 和 Chrome */
}
@keyframes bigNum {
0% {
font-size: 38px;
}
50% {
top: 4px;
font-size: 44px;
}
100% {
top: 8px;
font-size: 36px;
}
}
room/css/room.less
......@@ -80,6 +80,7 @@
.box-r-top{
margin-top: 24px;
height: 506px;
position: relative;
}
}
.opc{
......@@ -316,6 +317,10 @@
}
.msg-ul{
height: 418px;
position: relative !important;
.zl-scrollContentDiv{
}
}
.gift-box{
height: 343px;
......@@ -603,4 +608,166 @@
bottom: 10px;
left: 10px;
font-size: 16px !important;
}
\ No newline at end of file
}
.gift-show-box{
width: 430px;
position: absolute;
height: 310px;
overflow: hidden;
left: -500px;
padding-top: 80px;
}
.gift-show-content{
position: relative;
margin-top: 10px;
width: 358.4px;
height: 67.2px;
z-index: 550;
background: url('../images/gift/p1.png')no-repeat;
background-size: 100% 100% !important;
transition: 0.5s all;
opacity: 0;
}
.show{
opacity: 1;
}
.out{
transform :translateX(200px) ;
opacity: 0;
}
.gift-show-content1{
background: url('../images/gift/p1.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content2{
background: url('../images/gift/p2.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content3{
background: url('../images/gift/p3.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content4{
background: url('../images/gift/p4.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content5{
background: url('../images/gift/p5.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content6{
background: url('../images/gift/p6.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content7{
background: url('../images/gift/p7.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content8{
background: url('../images/gift/p8.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content9{
background: url('../images/gift/p9.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content10{
background: url('../images/gift/p10.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content11{
background: url('../images/gift/p11.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content12{
background: url('../images/gift/p12.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content13{
background: url('../images/gift/p13.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content14{
background: url('../images/gift/p14.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content15{
background: url('../images/gift/p15.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content16{
background: url('../images/gift/p16.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-content17{
background: url('../images/gift/p17.png')no-repeat;
background-size: 100% 100% !important;
}
.gift-show-img{
border-radius: 50%;
width: 50px;
height: 50px;
position: absolute;
top: 8px;
left: 8px;
}
.gift-show-name{
color: #FEE223;
font-size: 20px;
position: absolute;
left: 75px;
top: 8px;
}
.gift-show-gift{
color: #ffffff;
font-size: 16px;
position: absolute;
left: 75px;
top: 36px;
}
.gift-show-rich{
width: 55px;
height: 55px;
position: absolute;
left: 220px;
top: 3px;
}
.gift-show-x{
background: linear-gradient(to bottom, #FAE043, #FF6D04);
-webkit-background-clip: text;
color: transparent;
font-size: 30px;
font-weight: 700;
position: absolute;
left: 290px;
top: 14px;
}
.gift-show-num{
background: linear-gradient(to bottom, #FAE043, #FF6D04);
-webkit-background-clip: text;
color: transparent;
position: absolute;
font-size: 38px;
left: 320px;
top: 8px;
}
.gift-show-num-act{
animation:bigNum 0.4s linear; /* Safari 和 Chrome */
-webkit-animation:bigNum 0.4s linear; /* Safari 和 Chrome */
}
@keyframes bigNum
{
0% {
font-size: 38px;
}
50% {
top: 4px;
font-size: 44px;
}
100%{
top: 8px;
font-size: 36px;
}
}
view/public.html
......@@ -26,10 +26,10 @@
<a href="javascript:;">充值</a>
</li>
<li class="nav-li">
<a href="view/public.html">公众号</a>
<a href="public.html">公众号</a>
</li>
<li class="nav-li">
<a href="view/us.html">联系我们</a>
<a href="us.html">联系我们</a>
</li>
</ul>
......
view/us.html
......@@ -20,16 +20,16 @@
<nav class="nav">
<ul class="nav-ul">
<li class="nav-li">
<a href="">热门</a>
<a href="../index.html">热门</a>
</li>
<li class="nav-li pay">
<a href="javascript:;">充值</a>
</li>
<li class="nav-li">
<a href="view/public.html">公众号</a>
<a href="public.html">公众号</a>
</li>
<li class="nav-li">
<a href="view/us.html">联系我们</a>
<a href="us.html">联系我们</a>
</li>
</ul>
......
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 sign in to comment