Commit f2766b08 by libai

测试

parent 302f2bec
......@@ -557,3 +557,14 @@
.neck-nav-ul .neck-nav-li-click > img {
display: block;
}
.search-input {
width: 260px;
height: 36px;
background: #fff;
border-radius: 50px;
position: absolute;
top: 12px;
left: 830px;
font-size: 14px;
text-indent: 15px;
}
......@@ -576,4 +576,15 @@
display: block;
}
}
}
\ No newline at end of file
}
.search-input{
width: 260px;
height: 36px;
background: #fff;
border-radius: 50px;
position: absolute;
top: 12px;
left: 830px;
font-size: 14px;
text-indent: 15px;
}
\ No newline at end of file
......@@ -159,6 +159,10 @@ function loginGo(){
html+='</ul>';
$(".neck-nav-content").append(html)
}
var html=[];
html+='<input class="search-input" placeholder="搜索" type="text">'
html+='<img class="search-icon" src="https://www.footseen.xyz/yazhaiTest/images/front/search2.png">'
$(".neck-nav-content").append(html)
if(localStorage.uid!=undefined&&localStorage.uid!="undefined"){
$.ajax({
url:$ip+'user/queryUserBaseInfo',
......
......@@ -744,7 +744,7 @@ $(function(){
html+='<div style="background: url(https://app.ixiulive.com/static/footVideo/m/m'+mRandom+'.jpg?v=20220614);background-size: cover;" class="video-top-box">';
}
else html+='<div style="background: url(https://zhibocdn.yabolive.net/comm'+imgList.images[0].url.split('?')[0]+'?x-oss-process=image/resize,w_342" class="video-top-box">';
else html+='<div style="background: url(https://zhibocdn.yabolive.net/comm'+imgList.images[0].url.split('?')[0]+'?x-oss-process=image/resize,w_342);background-size: cover;" class="video-top-box">';
html+='<div class="video-top-shadow"></div>';
html+='</div>';
html+='<div class="video-name-box">';
......
......@@ -27,3 +27,200 @@
color: #fff;
border-radius: 50px;
}
.search-user-box .search-user-top {
font-weight: 700;
color: #333333;
font-size: 28px;
padding-top: 20px;
padding-bottom: 14px;
}
.search-user-ul {
width: 1440px;
margin: 0 auto;
}
.search-user-ul li {
width: 463px;
height: 120px;
margin-right: 20px;
background: linear-gradient(to right, #fff, #FFF4FA);
float: left;
margin-bottom: 20px;
border-radius: 8px;
overflow: hidden;
position: relative;
box-shadow: 2px 0 20px rgba(0, 0, 0, 0.05);
}
.search-user-ul li:nth-child(3n) {
margin-right: 0;
}
.search-user-ul .like-face {
width: 120px;
height: 120px;
position: absolute;
left: 0;
top: 0;
cursor: pointer;
}
.search-user-ul .like-user-btn1 {
width: 90px;
height: 40px;
background: #E53985;
border-radius: 20px;
position: absolute;
right: 8px;
line-height: 40px;
text-align: center;
color: #fff;
font-size: 14px;
top: 40px;
cursor: pointer;
}
.search-user-ul .like-user-btn2 {
width: 90px;
height: 40px;
background: #fff;
border-radius: 20px;
position: absolute;
right: 8px;
line-height: 40px;
text-align: center;
color: #E53985;
border: 1px solid #E53985;
font-size: 14px;
top: 40px;
cursor: pointer;
}
.search-user-ul .search-user-p1 {
line-height: 30px;
text-indent: 135px;
width: 350px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
padding-top: 32px;
}
.search-user-ul .search-user-p2 {
line-height: 30px;
text-indent: 135px;
color: #999999;
width: 350px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.search-video-top {
font-weight: 700;
color: #333333;
font-size: 28px;
margin-top: 15px;
margin-bottom: 14px;
}
.search-video-ul,
.images-box-ul {
width: 1440px;
margin-bottom: 15px;
}
.search-video-ul li,
.images-box-ul li {
width: 342px;
height: 258px;
margin-bottom: 18px;
margin-right: 24px;
float: left;
border-radius: 8px;
background: #FFFFFF;
position: relative;
overflow: hidden;
box-shadow: 2px 0 20px rgba(0, 0, 0, 0.05);
}
.search-video-ul .live-cursor-shadow,
.images-box-ul .live-cursor-shadow {
width: 342px;
height: 193px;
top: 0;
left: 0;
}
.search-video-ul > a:nth-child(4n) li,
.images-box-ul > a:nth-child(4n) li {
margin-right: 0;
}
.search-video-ul .video-top-box,
.images-box-ul .video-top-box {
height: 193px;
width: 342px;
position: relative;
}
.search-video-ul .video-top-shadow,
.images-box-ul .video-top-shadow {
width: 342px;
height: 50px;
position: absolute;
bottom: 0;
left: 0;
background: linear-gradient(to top, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0));
}
.search-video-ul .video-time,
.images-box-ul .video-time {
color: #fff;
font-size: 16px;
position: absolute;
z-index: 2;
right: 8px;
bottom: 10px;
}
.search-video-ul .video-name-box,
.images-box-ul .video-name-box {
position: relative;
height: 65px;
width: 342px;
}
.search-video-ul .video-face,
.images-box-ul .video-face {
position: absolute;
width: 40px;
height: 40px;
border-radius: 50%;
left: 6px;
top: 10px;
}
.search-video-ul .video-title,
.images-box-ul .video-title {
color: #333333;
font-size: 14px;
text-indent: 12px;
padding-top: 10px;
width: 330px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.search-video-ul .video-tag-box,
.images-box-ul .video-tag-box {
margin-left: 10px;
margin-top: 4px;
}
.search-video-ul .video-tag-box > div,
.images-box-ul .video-tag-box > div {
min-width: 42px;
max-width: 84px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
height: 18px;
background: #FFE8F1;
color: #E53985;
font-size: 12px;
line-height: 18px;
text-align: center;
border-radius: 4px;
float: left;
margin-right: 4px;
margin-bottom: 30px;
}
.search-images-top {
font-weight: 700;
color: #333333;
font-size: 28px;
margin-top: 15px;
margin-bottom: 14px;
}
......@@ -27,3 +27,197 @@
border-radius: 50px;
}
}
.search-user-box{
.search-user-top{
font-size: 28px;
font-weight: 700;
color: #333333;
font-size: 28px;
padding-top: 20px;
padding-bottom: 14px;
}
}
.search-user-ul{
width: 1440px;
margin: 0 auto;
li{
width: 463px;
height: 120px;
margin-right: 20px;
background: linear-gradient(to right, #fff, #FFF4FA);
float: left;
margin-bottom: 20px;
border-radius: 8px;
overflow: hidden;
position: relative;
box-shadow: 2px 0 20px rgb(0 0 0 / 5%);
}
li:nth-child(3n){
margin-right: 0;
}
.like-face {
width: 120px;
height: 120px;
position: absolute;
left: 0;
top: 0;
cursor: pointer;
}
.like-user-btn1{
width: 90px;
height: 40px;
background:#E53985;
border-radius: 20px;
position: absolute;
right: 8px;
line-height: 40px;
text-align: center;
color: #fff;
font-size: 14px;
top: 40px;
cursor: pointer;
}
.like-user-btn2 {
width: 90px;
height: 40px;
background: #fff;
border-radius: 20px;
position: absolute;
right: 8px;
line-height: 40px;
text-align: center;
color: #E53985;
border: 1px solid #E53985;
font-size: 14px;
top: 40px;
cursor: pointer;
}
.search-user-p1{
line-height: 30px;
text-indent: 135px;
width: 350px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
padding-top: 32px;
}
.search-user-p2{
line-height: 30px;
text-indent: 135px;
color: #999999;
width: 350px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
}
.search-video-top{
font-size: 28px;
font-weight: 700;
color: #333333;
font-size: 28px;
margin-top: 15px;
margin-bottom: 14px;
}
.search-video-ul,.images-box-ul{
width: 1440px;
margin-bottom: 15px;
li{
width: 342px;
height: 258px;
margin-bottom: 18px;
margin-right: 24px;
float: left;
border-radius: 8px;
background: #FFFFFF;
position: relative;
overflow: hidden;
box-shadow: 2px 0 20px rgb(0 0 0 / 5%);
}
.live-cursor-shadow{
width: 342px;
height: 193px;
top: 0;
left: 0;
}
>a:nth-child(4n){
li{
margin-right: 0;
}
}
.video-top-box{
height: 193px;
width: 342px;
position: relative;
}
.video-top-shadow{
width: 342px;
height: 50px;
position: absolute;
bottom: 0;
left: 0;
background:linear-gradient(to top,rgba(0,0,0,0.4),rgba(0,0,0,0));
}
.video-time{
color: #fff;
font-size: 16px;
position: absolute;
z-index: 2;
right: 8px;
bottom: 10px;
}
.video-name-box{
position: relative;
height: 65px;
width: 342px;
}
.video-face{
position: absolute;
width: 40px;
height: 40px;
border-radius: 50%;
left: 6px;
top: 10px;
}
.video-title{
color: #333333;
font-size: 14px;
text-indent: 12px;
padding-top: 10px;
width: 330px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.video-tag-box{
margin-left: 10px;
margin-top: 4px;
>div{
min-width: 42px;
max-width: 84px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
height: 18px;
background: #FFE8F1;
color: #E53985;
font-size: 12px;
line-height: 18px;
text-align: center;
border-radius: 4px;
float: left;
margin-right: 4px;
margin-bottom: 30px;
}
}
}
.search-images-top{
font-size: 28px;
font-weight: 700;
color: #333333;
font-size: 28px;
margin-top: 15px;
margin-bottom: 14px;
}
\ No newline at end of file
......@@ -33,7 +33,156 @@
<div>影片</div>
<div>圖檔</div>
</div>
<div class="">用戶</div>
<div class="search-user-box">
<div class="search-user-top">用戶</div>
<ul class="search-user-ul clearfix">
<li>
<p class="search-user-p1">會飛5247575</p>
<p class="search-user-p2">Footseen ID:123456</p>
<a href="index.html?fid=990063143"><img class="like-face" src="https://zhibocdn.yabolive.net/comm/user/img/28425247/4e3d2bf4e4724334bf5dfde8fd038e41.jpg?mainland=1?x-oss-process=image/resize,w_120" alt=""></a>
<div data-type="2" data-type2="990063143" class="like-user-btn1 like-user-btn2">已追蹤</div>
</li>
<li>
<p class="search-user-p1">會飛5247575</p>
<p class="search-user-p2">Footseen ID:123456</p>
<a href="index.html?fid=990063143"><img class="like-face" src="https://zhibocdn.yabolive.net/comm/user/img/28425247/4e3d2bf4e4724334bf5dfde8fd038e41.jpg?mainland=1?x-oss-process=image/resize,w_120" alt=""></a>
<div data-type="2" data-type2="990063143" class="like-user-btn1 like-user-btn2">已追蹤</div>
</li>
<li>
<p class="search-user-p1">會飛5247575</p>
<p class="search-user-p2">Footseen ID:123456</p>
<a href="index.html?fid=990063143"><img class="like-face" src="https://zhibocdn.yabolive.net/comm/user/img/28425247/4e3d2bf4e4724334bf5dfde8fd038e41.jpg?mainland=1?x-oss-process=image/resize,w_120" alt=""></a>
<div data-type="2" data-type2="990063143" class="like-user-btn1 like-user-btn2">已追蹤</div>
</li>
<li>
<p class="search-user-p1">會飛5247575</p>
<p class="search-user-p2">Footseen ID:123456</p>
<a href="index.html?fid=990063143"><img class="like-face" src="https://zhibocdn.yabolive.net/comm/user/img/28425247/4e3d2bf4e4724334bf5dfde8fd038e41.jpg?mainland=1?x-oss-process=image/resize,w_120" alt=""></a>
<div data-type="2" data-type2="990063143" class="like-user-btn1 like-user-btn2">已追蹤</div>
</li>
<li>
<p class="search-user-p1">會飛5247575</p>
<p class="search-user-p2">Footseen ID:123456</p>
<a href="index.html?fid=990063143"><img class="like-face" src="https://zhibocdn.yabolive.net/comm/user/img/28425247/4e3d2bf4e4724334bf5dfde8fd038e41.jpg?mainland=1?x-oss-process=image/resize,w_120" alt=""></a>
<div data-type="2" data-type2="990063143" class="like-user-btn1 like-user-btn2">已追蹤</div>
</li>
</ul>
</div>
<div class="video-box">
<div class="search-video-top">影片</div>
<ul class="search-video-ul clearfix">
<a href="room/videoRoom.html?topicId=712639990057039&amp;tag=">
<li>
<div style="background: url(https://zhibocdn.yabolive.net/comm/theme/2022-06-22/beefd1776f8f40648b28acc36514fef5.mp4?x-oss-process=video/snapshot,t_90000,f_jpg,w_342,h_0,m_fast,f_jpg)no-repeat;background-size: cover;background-position-y: center;" class="video-top-box">
<div class="live-cursor-shadow"></div>
<img class="play-icon" src="../images/front/play-icon.png">
<div class="video-top-shadow"></div>
<span class="video-time">02:25</span>
</div>
<div class="video-name-box">
<p class="video-title">旗袍少女白絲</p>
<div class="video-tag-box">
<div data-type="10" class="tag">#亞洲</div><div data-type="31" class="tag">#熟女</div><div data-type="9" class="tag">#絲襪</div><div data-type="28" class="tag">#秀腿</div><div data-type="157" class="tag">#擺拍</div><div data-type="57" class="tag">#性感</div>
</div>
</div>
</li>
</a>
<a href="room/videoRoom.html?topicId=712639990057039&amp;tag=">
<li>
<div style="background: url(https://zhibocdn.yabolive.net/comm/theme/2022-06-22/beefd1776f8f40648b28acc36514fef5.mp4?x-oss-process=video/snapshot,t_90000,f_jpg,w_342,h_0,m_fast,f_jpg)no-repeat;background-size: cover;background-position-y: center;" class="video-top-box">
<div class="live-cursor-shadow"></div>
<img class="play-icon" src="../images/front/play-icon.png">
<div class="video-top-shadow"></div>
<span class="video-time">02:25</span>
</div>
<div class="video-name-box">
<p class="video-title">旗袍少女白絲</p>
<div class="video-tag-box">
<div data-type="10" class="tag">#亞洲</div><div data-type="31" class="tag">#熟女</div><div data-type="9" class="tag">#絲襪</div><div data-type="28" class="tag">#秀腿</div><div data-type="157" class="tag">#擺拍</div><div data-type="57" class="tag">#性感</div>
</div>
</div>
</li>
</a>
<a href="room/videoRoom.html?topicId=712639990057039&amp;tag=">
<li>
<div style="background: url(https://zhibocdn.yabolive.net/comm/theme/2022-06-22/beefd1776f8f40648b28acc36514fef5.mp4?x-oss-process=video/snapshot,t_90000,f_jpg,w_342,h_0,m_fast,f_jpg)no-repeat;background-size: cover;background-position-y: center;" class="video-top-box">
<div class="live-cursor-shadow"></div>
<img class="play-icon" src="../images/front/play-icon.png">
<div class="video-top-shadow"></div>
<span class="video-time">02:25</span>
</div>
<div class="video-name-box">
<p class="video-title">旗袍少女白絲</p>
<div class="video-tag-box">
<div data-type="10" class="tag">#亞洲</div><div data-type="31" class="tag">#熟女</div><div data-type="9" class="tag">#絲襪</div><div data-type="28" class="tag">#秀腿</div><div data-type="157" class="tag">#擺拍</div><div data-type="57" class="tag">#性感</div>
</div>
</div>
</li>
</a>
<a href="room/videoRoom.html?topicId=712639990057039&amp;tag=">
<li>
<div style="background: url(https://zhibocdn.yabolive.net/comm/theme/2022-06-22/beefd1776f8f40648b28acc36514fef5.mp4?x-oss-process=video/snapshot,t_90000,f_jpg,w_342,h_0,m_fast,f_jpg)no-repeat;background-size: cover;background-position-y: center;" class="video-top-box">
<div class="live-cursor-shadow"></div>
<img class="play-icon" src="../images/front/play-icon.png">
<div class="video-top-shadow"></div>
<span class="video-time">02:25</span>
</div>
<div class="video-name-box">
<p class="video-title">旗袍少女白絲</p>
<div class="video-tag-box">
<div data-type="10" class="tag">#亞洲</div><div data-type="31" class="tag">#熟女</div><div data-type="9" class="tag">#絲襪</div><div data-type="28" class="tag">#秀腿</div><div data-type="157" class="tag">#擺拍</div><div data-type="57" class="tag">#性感</div>
</div>
</div>
</li>
</a>
<a href="room/videoRoom.html?topicId=712639990057039&amp;tag=">
<li>
<div style="background: url(https://zhibocdn.yabolive.net/comm/theme/2022-06-22/beefd1776f8f40648b28acc36514fef5.mp4?x-oss-process=video/snapshot,t_90000,f_jpg,w_342,h_0,m_fast,f_jpg)no-repeat;background-size: cover;background-position-y: center;" class="video-top-box">
<div class="live-cursor-shadow"></div>
<img class="play-icon" src="../images/front/play-icon.png">
<div class="video-top-shadow"></div>
<span class="video-time">02:25</span>
</div>
<div class="video-name-box">
<p class="video-title">旗袍少女白絲</p>
<div class="video-tag-box">
<div data-type="10" class="tag">#亞洲</div><div data-type="31" class="tag">#熟女</div><div data-type="9" class="tag">#絲襪</div><div data-type="28" class="tag">#秀腿</div><div data-type="157" class="tag">#擺拍</div><div data-type="57" class="tag">#性感</div>
</div>
</div>
</li>
</a>
</ul>
</div>
<div class="images-box">
<div class="search-images-top">圖檔</div>
<ul class="images-box-ul clearfix">
<a href="room/imagesRoom.html?topicId=5477861126181&amp;tag=">
<li>
<div style="background: url(https://zhibocdn.yabolive.net/comm/theme/2021-09-03/cab8cd297cb241809f3a223abdd71349.png?x-oss-process=image/resize,w_342);background-size: cover;" class="video-top-box">
<div class="video-top-shadow"></div>
</div>
<div class="video-name-box">
<p class="video-title">看姐姐18釐米的高跟鞋</p>
<div class="video-tag-box">
<div data-type="10" class="tag">#亞洲</div><div data-type="180" class="tag">#情趣</div><div data-type="29" class="tag">#瘦小</div><div data-type="11" class="tag">#黑絲</div><div data-type="28" class="tag">#秀腿</div><div data-type="30" class="tag">#秀足</div><div data-type="45" class="tag">#裸足</div>
</div>
</div>
</li>
<li>
<div style="background: url(https://zhibocdn.yabolive.net/comm/theme/2021-09-03/cab8cd297cb241809f3a223abdd71349.png?x-oss-process=image/resize,w_342);background-size: cover;" class="video-top-box">
<div class="video-top-shadow"></div>
</div>
<div class="video-name-box">
<p class="video-title">看姐姐18釐米的高跟鞋</p>
<div class="video-tag-box">
<div data-type="10" class="tag">#亞洲</div><div data-type="180" class="tag">#情趣</div><div data-type="29" class="tag">#瘦小</div><div data-type="11" class="tag">#黑絲</div><div data-type="28" class="tag">#秀腿</div><div data-type="30" class="tag">#秀足</div><div data-type="45" class="tag">#裸足</div>
</div>
</div>
</li>
</a>
</ul>
</div>
<div style="height:60px;"></div>
</div>
<div class="login-content"></div>
</body>
......
......@@ -871,4 +871,4 @@
border: 2px solid #E53985;
transform: scale(1.1);
}
}
\ 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