Skip to content

libai / footseen-large-website

Go to a project
Commit 9c9a9e7c by libai
Options

测试

parent 0f2ceee7
Inline Side-by-side
Showing with 168 additions and 7 deletions
mTest/index.html
...@@ -932,6 +932,7 @@ $(function(){ ...@@ -932,6 +932,7 @@ $(function(){
startX=e.changedTouches[0].clientX startX=e.changedTouches[0].clientX
startY=e.changedTouches[0].clientY startY=e.changedTouches[0].clientY
zwidth=0 zwidth=0
}) })
$("body").on("touchmove",function(e){ $("body").on("touchmove",function(e){
if(touchX==null){ if(touchX==null){
......
mTest/room/css/liveRoom.css
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
height: 1.85rem; height: 1.85rem;
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0.1rem;
z-index: 5; z-index: 5;
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);
} }
...@@ -745,7 +745,7 @@ ...@@ -745,7 +745,7 @@
.room-bg { .room-bg {
width: 100vw; width: 100vw;
position: fixed; position: fixed;
top: 0.1rem; top: 0rem;
height: 99vh; height: 99vh;
} }
.more-layer { .more-layer {
......
mTest/room/css/liveRoom.less
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
height: 1.85rem; height: 1.85rem;
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0.1rem;
z-index: 5; z-index: 5;
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);
// background: rgba(0,0,0,0.2); // background: rgba(0,0,0,0.2);
...@@ -768,9 +768,9 @@ ...@@ -768,9 +768,9 @@
.room-bg{ .room-bg{
width: 100vw; width: 100vw;
position: fixed; position: fixed;
top: 0.1rem; top: 0rem;
height: 99vh; height: 99vh;
// transition: 0.35s all;
} }
.more-layer{ .more-layer{
height: 4.4rem; height: 4.4rem;
......
mTest/room/liveRoom.html
...@@ -30,8 +30,11 @@ ...@@ -30,8 +30,11 @@
<script src="../lib/fsize.js"></script> <script src="../lib/fsize.js"></script>
<link rel="stylesheet" href="../css/base.css"> <link rel="stylesheet" href="../css/base.css">
<link rel="stylesheet" href="../css/layer.css"> <link rel="stylesheet" href="../css/layer.css">
<link rel="stylesheet" href="css/liveRoom.css?v=2022111401"> <link rel="stylesheet" href="css/liveRoom.css?v=2022111601">
<link rel="stylesheet" href="../css/login.css?v=2022111401"> <link rel="stylesheet" href="../css/login.css?v=2022111401">
<script src="https://accounts.google.com/gsi/client" async defer></script>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js"></script>
<script src="../lib/hello.js"></script>
<style> <style>
.layui-layer-shade { .layui-layer-shade {
opacity: 0.7 !important; opacity: 0.7 !important;
...@@ -560,10 +563,12 @@ ...@@ -560,10 +563,12 @@
<script> <script>
$(function(){ $(function(){
var dHeight=$(document).height() var dHeight=$(document).height()
var topRoomId
var BottomRoomId
localStorage.canvasCode="phone" localStorage.canvasCode="phone"
var giftMd5=null; var giftMd5=null;
$(".room-bg").css("height",$(document).height()) $(".room-bg").css("height",$(document).height())
hotList()
$(".msg-btn").on("click",function(){ $(".msg-btn").on("click",function(){
if(localStorage.uid==undefined){ if(localStorage.uid==undefined){
loginPage() loginPage()
...@@ -964,6 +969,23 @@ $(function(){ ...@@ -964,6 +969,23 @@ $(function(){
else $(".hot-list-top-text2 span").text(data.hotResult.rank) else $(".hot-list-top-text2 span").text(data.hotResult.rank)
for (var i = 0; i < data.ranklist.length; i++) { for (var i = 0; i < data.ranklist.length; i++) {
var list = data.ranklist[i] var list = data.ranklist[i]
if(list.uid==sessionStorage.roomId){
if(i+1==data.ranklist.length){
BottomRoomId=data.ranklist[0].uid
}else{
BottomRoomId=data.ranklist[i+1].uid
}
if(i==0){
topRoomId=data.ranklist[data.ranklist.length-1].uid
}else{
topRoomId=data.ranklist[i-1].uid
}
if(data.ranklist.length==1){
topRoomId=list.uid
BottomRoomId=list.uid
}
}
html+='<li>'; html+='<li>';
html+='<div class="hot-list-li-box1">'+(i+1)+'</div>'; html+='<div class="hot-list-li-box1">'+(i+1)+'</div>';
html+='<div class="hot-list-li-box2">'; html+='<div class="hot-list-li-box2">';
...@@ -2072,7 +2094,144 @@ $(function(){ ...@@ -2072,7 +2094,144 @@ $(function(){
} }
}) })
} }
var oneRem=window.innerWidth/10
var touchX=null;
var touchY=null;
var startX=null;
var startY=null;
// var goX=null
// var goY=null
var degNum=null
var goDeg=null //滑動角度
var zwidth=null;//滑動長度
var angle=null;
var rightNavShow=false
var topMoveNumTop=0
var topMoveNumBottom=0
var touchOk=true;
//登录相关
$("body").on("touchstart",function(e){
if(touchOk==false)return;
startX=e.changedTouches[0].clientX
startY=e.changedTouches[0].clientY
zwidth=0
})
$("body").on("touchmove",function(e){
if(touchOk==false)return;
if(touchX==null){
touchX=e.changedTouches[0].clientX
touchY=e.changedTouches[0].clientY
return;
}
// if(e.changedTouches[0].clientY-startY>0)return
var xWidth=Math.abs(startX-e.changedTouches[0].clientX)
var yWidth=Math.abs(startY-e.changedTouches[0].clientY)
// zwidth=Math.floor(Math.sqrt(yWidth*yWidth+xWidth*xWidth)/oneRem*100)/100-1
zwidth=Math.floor(Math.sqrt(yWidth*yWidth+xWidth*xWidth)/oneRem*100)/100
//左右
if(startX>e.changedTouches[0].clientX){
//左
touchX=e.changedTouches[0].clientX
goDeg=Math.abs((-90+(asinGo(e.changedTouches[0].clientX-startX,e.changedTouches[0].clientY-startY))))
}else if(startX<e.changedTouches[0].clientX){
//右
touchX=e.changedTouches[0].clientX
goDeg=Math.abs((90-asinGo(e.changedTouches[0].clientX-startX,e.changedTouches[0].clientY-startY))*-1)
}
// 上下
if(touchY>e.changedTouches[0].clientY){
// console.log("向上")
touchY=e.changedTouches[0].clientY
goDeg=Math.abs((-90+(asinGo(e.changedTouches[0].clientX-startX,e.changedTouches[0].clientY-startY))))
if(zwidth<0.5){
return;
}
if(angle==null){
angle=Math.abs(goDeg-90)
}
if(angle>15){
return;
}
topMoveNumTop=e.changedTouches[0].clientY-startY
console.log("向上",topMoveNumTop,angle)
$(".room-bg").css("top",topMoveNumTop+'px')
}else if(touchY<e.changedTouches[0].clientY){
// console.log("向下")
touchY=e.changedTouches[0].clientY
goDeg=Math.abs((-90+(asinGo(e.changedTouches[0].clientX-startX,e.changedTouches[0].clientY-startY))))
topMoveNumBottom=e.changedTouches[0].clientY-startY
if(zwidth<0.5){
return;
}
if(angle==null){
angle=Math.abs(goDeg-90)
}
if(angle>15)return;
$(".room-bg").css("top",topMoveNumBottom+'px')
}
})
$("body").on("touchend",function(e){
if(touchOk==false)return;
// goX=e.changedTouches[0].clientX-startX
// goY=e.changedTouches[0].clientY-startY
if(startX>e.changedTouches[0].clientX){
//向左
}
if(startX<e.changedTouches[0].clientX){
//向右
}
if(startY<e.changedTouches[0].clientY){
//向下
angle=Math.abs(goDeg-90)
// console.log(zwidth)
if(angle<30&&zwidth>5){
console.log("向下了")
$(".room-bg").css("transition","0.35s all")
$(".room-bg").css("top","100vh")
setTimeout(function() {
window.location.href="liveRoom.html?roomId="+topRoomId+""
}, 350);
return
}
}
if(startY>e.changedTouches[0].clientY){
//向下
angle=Math.abs(goDeg-90)
console.log(zwidth)
if(angle<30&&zwidth>5){
console.log("向上了")
$(".room-bg").css("transition","0.35s all")
$(".room-bg").css("top","-100vh")
setTimeout(function() {
window.location.href="liveRoom.html?roomId="+BottomRoomId+""
}, 350);
return
}
}
angle=null
$(".room-bg").css("transition","0.35s all")
$(".room-bg").css("top","0")
touchOk=false
setTimeout(() => {
$(".room-bg").css("transition","none")
touchOk=true
}, 350);
})
function asinGo(x,y){
return degNum=Math.round(180*Math.asin(x/Math.sqrt(x*x+y*y))/Math.PI*10)/10
}
}) })
</script> </script>
</html> </html>
\ No newline at end of file
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