更新
@ -6,26 +6,244 @@
|
||||
<link rel="shortcut icon" type="image/x-icon" href="../../static/img/favicon.ico" rel="external nofollow" />
|
||||
<link rel="stylesheet" href="../../static/css/index.css">
|
||||
<link rel="stylesheet" href="../../static/layui/css/layui.css">
|
||||
|
||||
<script src="../../static/layui/layui.all.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="head">
|
||||
<div class="content">
|
||||
<div class="not-login-information">
|
||||
<div class="login-text"><a href="/ebuy/login">亲,请登录</a></div>
|
||||
<div class="register-text"><a href="/ebuy/register">免费注册</a></div>
|
||||
</div>
|
||||
<div class="login-information">
|
||||
<div class="login-text">
|
||||
<span class="login-text-username"></span>
|
||||
<i id="icon1" class="layui-icon layui-icon-triangle-d"></i>
|
||||
<div class="personInfo">
|
||||
<div class="function">
|
||||
<div class="account-management">账户管理</div>
|
||||
<div class="sign-out">退出</div>
|
||||
</div>
|
||||
<div class="info">
|
||||
<div class="head-portrait"></div>
|
||||
<div class="grade">
|
||||
<div class="ebuy-grade">BUY能量:222</div>
|
||||
<div class="membership-level">普通会员</div>
|
||||
</div>
|
||||
<div class="more-equity">查看你的专属权益</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="news">
|
||||
<div class="news-photo"></div>
|
||||
<span>消息</span>
|
||||
<span class="news-number">3</span>
|
||||
<i id="icon2" class="layui-icon layui-icon-triangle-d"></i>
|
||||
<div class="news-content">
|
||||
<div class="one-news">
|
||||
双12活动来临!
|
||||
</div>
|
||||
<div class="one-news">
|
||||
速备年货!
|
||||
</div>
|
||||
<div class="one-news">
|
||||
除夕全家福!
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="function">
|
||||
<div class="cart">
|
||||
<a href="">
|
||||
<div class="cart-photo"></div>
|
||||
购物车
|
||||
<span class="cart-number">1</span>
|
||||
</a>
|
||||
<i id="icon3" class="layui-icon layui-icon-triangle-d"></i>
|
||||
<div class="cart-content">
|
||||
<span>最近加入的宝贝:</span>
|
||||
<div class="commodity">
|
||||
<div class="one-commodity">
|
||||
<div class="commodity-photo"></div>
|
||||
<div class="commodity-name">电水壶家用大容量自动断电保温一体电热水壶茶壶不锈钢电壶烧水壶</div>
|
||||
<div class="price-delete">
|
||||
<div class="commodity-price">¥220.0</div>
|
||||
<div class="commodity-delete">删除</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<span class="cart-bottom-text">购物车里还有21件宝贝</span>
|
||||
<br>
|
||||
<button class="cart-but">查看我的购物车</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="collection">
|
||||
<i id="icon6" class="layui-icon layui-icon-rate"></i>
|
||||
<a href="">收藏夹 </a>
|
||||
<!--<i id="icon4" class="layui-icon layui-icon-triangle-d"></i>-->
|
||||
</div>
|
||||
<div class="set-up-shop">
|
||||
<div class="shop-photo"></div>
|
||||
<a href="">免费开店 </a>
|
||||
</div>
|
||||
<div class="business">
|
||||
<div class="shop-photo"></div>
|
||||
<a href="">我的店铺 </a>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="service">
|
||||
<div class="service-photo"></div>
|
||||
<a href="">联系客服 </a></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="middle">
|
||||
<div class="box">
|
||||
<div class="search">
|
||||
<div class="search-log">
|
||||
<div class="log"></div>
|
||||
</div>
|
||||
<div class="search-box">
|
||||
<div class="search-box-box">
|
||||
<input type="text" class="search-box-input" placeholder="请输入搜索的宝贝">
|
||||
<div class="search-text">搜索</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="search-blank"></div>
|
||||
</div>
|
||||
<div class="strip"></div>
|
||||
<div class="navigation-carousel-person">
|
||||
<div class="navigation">
|
||||
<ul>
|
||||
<li>
|
||||
<a href="">女装</a> / <a href="">男装</a> / <a href="">内衣</a><i class="layui-icon layui-icon-right"></i>
|
||||
<div id="li-1" class="li-content" style="display: inline;">
|
||||
<div class="three-type">
|
||||
<div class="type-1">
|
||||
<div class="title">
|
||||
<span>女装</span>
|
||||
<div class="more">
|
||||
更多
|
||||
<i class="layui-icon layui-icon-right"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="type-content">
|
||||
<span>羽绒服</span>
|
||||
<span>棉衣棉服</span>
|
||||
<span>毛呢大衣</span>
|
||||
<span>毛衣针织</span>
|
||||
<span>卫衣绒衫</span>
|
||||
<span>皮衣皮草</span>
|
||||
<span>裤裙</span>
|
||||
<span>衬衫</span>
|
||||
<span>半身裙</span>
|
||||
<span>汉服</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="type-1">
|
||||
<div class="title">
|
||||
<span>女装</span>
|
||||
<div class="more">
|
||||
更多
|
||||
<i class="layui-icon layui-icon-right"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="type-content">
|
||||
<span>羽绒服</span>
|
||||
<span>棉衣棉服</span>
|
||||
<span>毛呢大衣</span>
|
||||
<span>毛衣针织</span>
|
||||
<span>卫衣绒衫</span>
|
||||
<span>皮衣皮草</span>
|
||||
<span>裤裙</span>
|
||||
<span>衬衫</span>
|
||||
<span>半身裙</span>
|
||||
<span>汉服</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="type-1">
|
||||
<div class="title">
|
||||
<span>女装</span>
|
||||
<div class="more">
|
||||
更多
|
||||
<i class="layui-icon layui-icon-right"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="type-content">
|
||||
<span>羽绒服</span>
|
||||
<span>棉衣棉服</span>
|
||||
<span>毛呢大衣</span>
|
||||
<span>毛衣针织</span>
|
||||
<span>卫衣绒衫</span>
|
||||
<span>皮衣皮草</span>
|
||||
<span>裤裙</span>
|
||||
<span>衬衫</span>
|
||||
<span>半身裙</span>
|
||||
<span>汉服</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="you-like">
|
||||
<sqan>猜你喜欢</sqan>
|
||||
<div class="photo">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">鞋靴</a> / <a href="">箱包</a> / <a href="">配件</a><i class="layui-icon layui-icon-right"></i>
|
||||
<div id="li-2" class="li-content"></div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">童装玩具</a> / <a href="">孕产</a> / <a href="">用品</a><i class="layui-icon layui-icon-right"></i>
|
||||
<div id="li-3" class="li-content"></div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">家电</a> / <a href="">数码</a> / <a href="">手机</a><i class="layui-icon layui-icon-right"></i>
|
||||
<div id="li-4" class="li-content"></div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">美妆</a> / <a href="">洗护</a> / <a href="">保健品</a><i class="layui-icon layui-icon-right"></i>
|
||||
<div id="li-5" class="li-content"></div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">运动</a> / <a href="">户外</a> / <a href="">乐器</a><i class="layui-icon layui-icon-right"></i>
|
||||
<div id="li-6" class="li-content"></div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">游戏</a> / <a href="">动漫</a> / <a href="">影视</a><i class="layui-icon layui-icon-right"></i>
|
||||
<div id="li-7" class="li-content"></div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">美食</a> / <a href="">生鲜</a> / <a href="">零食</a><i class="layui-icon layui-icon-right"></i>
|
||||
<div id="li-8" class="li-content"></div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">家具</a> / <a href="">家饰</a> / <a href="">家纺</a><i class="layui-icon layui-icon-right"></i>
|
||||
<div id="li-9" class="li-content"></div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="">百货</a> / <a href="">餐厨</a> / <a href="">家庭保健</a><i class="layui-icon layui-icon-right"></i>
|
||||
<div id="li-10" class="li-content"></div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="carousel"></div>
|
||||
<div class="person"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="bottom">
|
||||
|
||||
</div>
|
||||
</body>
|
||||
|
||||
<script src="../../static/js/jquery-1.12.2.js"></script>
|
||||
<script src="../../static/js/index.js"></script>
|
||||
<script src="../../static/layui/layui.js"></script>
|
||||
<script src="../../static/layui/layui.all.js"></script>
|
||||
|
||||
</html>
|
@ -16,16 +16,327 @@ body{
|
||||
background: rgb(245,245,245);
|
||||
flex: 1;
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
.head .content{
|
||||
|
||||
width: 80%;
|
||||
height: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.head .content .not-login-information{
|
||||
|
||||
line-height: 3em;
|
||||
}
|
||||
.head .content .not-login-information .login-text{
|
||||
float: left;
|
||||
}
|
||||
.head .content .not-login-information .login-text a{
|
||||
color: rgb(23,181,254);
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .not-login-information .register-text{
|
||||
margin-left: 2em;
|
||||
float: left;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .not-login-information .register-text :hover{
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
.head .content .login-information{
|
||||
display: none;
|
||||
line-height: 3em;
|
||||
}
|
||||
.head .content .login-information :hover{
|
||||
background: white;
|
||||
|
||||
}
|
||||
.head .content .login-information .login-text :hover{
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
.head .content .login-information .login-text{
|
||||
float: left;
|
||||
}
|
||||
.head .content .login-information .login-text .login-text-username{
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .login-information .login-text #icon1{
|
||||
cursor: pointer;
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
.head .content .login-information .login-text .personInfo{
|
||||
display: none;
|
||||
background: #fff;
|
||||
width: 240px;
|
||||
height: 160px;
|
||||
position: absolute;
|
||||
padding: 1em;
|
||||
top: 3em;
|
||||
left: 10%;
|
||||
border: 1px solid rgb(238,238,238);
|
||||
}
|
||||
.head .content .login-information .login-text .personInfo .function{
|
||||
color: black;
|
||||
}
|
||||
.head .content .login-information .login-text .personInfo .function :hover{
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
.head .content .login-information .login-text .personInfo .function .account-management{
|
||||
margin-right: 2em;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .login-information .login-text .personInfo .function .sign-out{
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .login-information .login-text .personInfo .info{
|
||||
margin-top: -0.6em;
|
||||
}
|
||||
.head .content .login-information .login-text .personInfo .info :hover{
|
||||
color: black;
|
||||
}
|
||||
.head .content .login-information .login-text .personInfo .info .head-portrait{
|
||||
height: 3em;
|
||||
width: 3em;
|
||||
background: url("../img/E.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
-moz-background-size: 80% 80%;
|
||||
background-position: center;
|
||||
margin-top: 5em;
|
||||
margin-left: 2em;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .login-information .login-text .personInfo .info .grade{
|
||||
color: black;
|
||||
float: right;
|
||||
margin-top: -3.4em;
|
||||
margin-right: 3em;
|
||||
}
|
||||
.head .content .login-information .login-text .personInfo .info .grade .ebuy-grade{
|
||||
height: 2em;
|
||||
line-height: 2em;
|
||||
}
|
||||
.head .content .login-information .login-text .personInfo .info .grade .membership-level{
|
||||
height: 2em;
|
||||
line-height: 2em;
|
||||
}
|
||||
.head .content .login-information .login-text .personInfo .info .more-equity{
|
||||
text-align: center;
|
||||
border: 1px solid rgb(129,190,255);
|
||||
background: rgb(220,238,252);
|
||||
padding: 4px 0;
|
||||
height: 1em;
|
||||
line-height: 1em;
|
||||
margin-top: 1.6em;
|
||||
color: black;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .login-information .news{
|
||||
float: left;
|
||||
}
|
||||
.head .content .login-information .news span{
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .login-information .news #icon2{
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
.head .content .login-information .news :hover{
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
.head .content .login-information .news .news-number{
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
.head .content .login-information .news .news-photo{
|
||||
background: url("../img/news.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
-moz-background-size: 80% 80%;
|
||||
background-position: center;
|
||||
width: 1.5em;
|
||||
height: 1.5em;
|
||||
float: left;
|
||||
margin-top: 0.76em;
|
||||
margin-left: 2em;
|
||||
}
|
||||
.head .content .login-information .news .news-content{
|
||||
display: none;
|
||||
background: #fff;
|
||||
width: 240px;
|
||||
height: 160px;
|
||||
position: absolute;
|
||||
padding: 1em;
|
||||
top: 3em;
|
||||
margin-left: -110px;
|
||||
border: 1px solid rgb(238,238,238);
|
||||
overflow: auto;
|
||||
color: black;
|
||||
}
|
||||
.head .content .login-information .news .news-content :hover{
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
.head .content .login-information .news .news-content .one-news{
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .function{
|
||||
display: flex;
|
||||
float: right;
|
||||
line-height: 3em;
|
||||
|
||||
}
|
||||
.head .content .function :hover{
|
||||
color: rgb(23,181,254);
|
||||
background: white;
|
||||
}
|
||||
.head .content .function .cart{
|
||||
margin-right: 2em;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .function .cart .cart-photo{
|
||||
float: left;
|
||||
height: 2em;
|
||||
width: 2em;
|
||||
background: url("../img/cart.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
-moz-background-size: 80% 80%;
|
||||
background-position: center;
|
||||
margin-top: 0.32em;
|
||||
}
|
||||
.head .content .function .cart .cart-number{
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
.head .content .function .cart .cart-content{
|
||||
display: none;
|
||||
background: #fff;
|
||||
width: 240px;
|
||||
height: 340px;
|
||||
position: absolute;
|
||||
padding: 1em;
|
||||
top: 3em;
|
||||
cursor: auto;
|
||||
border: 1px solid rgb(238,238,238);
|
||||
color: black;
|
||||
font-weight: bold;
|
||||
overflow: auto;
|
||||
margin-left: -102px;
|
||||
}
|
||||
.head .content .function .cart .cart-content span{
|
||||
color: black;
|
||||
}
|
||||
.head .content .function .cart .cart-content .commodity .one-commodity{
|
||||
height: 3em;
|
||||
font-weight: normal;
|
||||
display: flex;
|
||||
color: black;
|
||||
margin-top: 1em
|
||||
}
|
||||
.head .content .function .cart .cart-content .commodity .one-commodity .commodity-photo{
|
||||
flex:1;
|
||||
background:url("../img/chufang01.jpg") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
background-position: center;
|
||||
height: 100%;
|
||||
width: 3em;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .function .cart .cart-content .commodity .one-commodity .commodity-name{
|
||||
flex: 6;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-top: -0.8em;
|
||||
margin-left: 0.5em;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .function .cart .cart-content .commodity .one-commodity .price-delete{
|
||||
flex:1;
|
||||
}
|
||||
.head .content .function .cart .cart-content .commodity .one-commodity .price-delete .commodity-price{
|
||||
color: rgb(23,181,254);
|
||||
font-weight: bold;
|
||||
height: 1em;
|
||||
margin-top: -0.8em;
|
||||
}
|
||||
.head .content .function .cart .cart-content .commodity .one-commodity .price-delete .commodity-delete{
|
||||
margin-top: 0.5em;
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .function .cart .cart-content .cart-bottom-text{
|
||||
float: right;
|
||||
}
|
||||
.head .content .function .cart .cart-content .cart-but{
|
||||
color: white;
|
||||
background: rgb(80,206,194);
|
||||
border: 0;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
vertical-align: middle;
|
||||
font-weight: normal;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
zoom: 1;
|
||||
height: 1.8em;
|
||||
line-height: 1.8em;
|
||||
float: right;
|
||||
}
|
||||
.head .content .function .collection{
|
||||
margin-right: 2em;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .function .set-up-shop{
|
||||
margin-right: 2em;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .function .business{
|
||||
display: none;
|
||||
margin-right: 2em;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .function .shop-photo{
|
||||
float: left;
|
||||
height: 2em;
|
||||
width: 2em;
|
||||
background: url("../img/shop.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 50% 50%;
|
||||
-moz-background-size: 50% 50%;
|
||||
background-position: center;
|
||||
margin-top: 0.4em;
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
.head .content .function .service{
|
||||
margin-right: 2em;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .content .function .service .service-photo{
|
||||
float: left;
|
||||
height: 2em;
|
||||
width: 2em;
|
||||
background: url("../img/service.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 60% 60%;
|
||||
-moz-background-size: 60% 60%;
|
||||
background-position: center;
|
||||
margin-top: 0.5em;
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
#icon3{
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
#icon4{
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
#icon5{
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
#icon6{
|
||||
color: rgb(23,181,254);
|
||||
}
|
||||
.middle{
|
||||
background: url("../img/background2.jpg") no-repeat;
|
||||
background-size:100% 100%;
|
||||
flex: 15;
|
||||
flex: 18;
|
||||
display: flex;
|
||||
overflow: auto;
|
||||
}
|
||||
@ -34,5 +345,164 @@ body{
|
||||
background: white;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.middle .box .search{
|
||||
display: flex;
|
||||
height: 20%;
|
||||
width: 100%;
|
||||
}
|
||||
.middle .box .search .search-log{
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
}
|
||||
.middle .box .search .search-log .log{
|
||||
background: url(../img/E-Buy04.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 110% 85%;
|
||||
-moz-background-size: 80% 80%;
|
||||
background-position: -5px 1px;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
.middle .box .search .search-box{
|
||||
flex: 4;
|
||||
height: 100%;
|
||||
}
|
||||
.middle .box .search .search-box .search-box-box{
|
||||
width: 95%;
|
||||
margin: auto;
|
||||
margin-top: 3em;
|
||||
height: 3.26em;
|
||||
border: 2px solid rgb(23,181,254);
|
||||
border-radius: 20px;
|
||||
background: rgb(23,181,254);
|
||||
}
|
||||
.middle .box .search .search-box .search-box-box .search-box-input{
|
||||
width: 85%;
|
||||
float: left;
|
||||
height: 2.5em;
|
||||
border: 0;
|
||||
margin-left: 1em;
|
||||
margin-top: 0.4em;
|
||||
text-indent: 10px;
|
||||
}
|
||||
.middle .box .search .search-box .search-box-box .search-text{
|
||||
width: 10%;
|
||||
float: left;
|
||||
height: 3em;
|
||||
line-height: 2.8em;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
margin-left: 1em;
|
||||
font-size: 1.2em;
|
||||
cursor: pointer;
|
||||
letter-spacing: 10px;
|
||||
}
|
||||
.middle .box .search .search-blank{
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
}
|
||||
.middle .box .strip{
|
||||
height: 40px;
|
||||
width: 100%;
|
||||
background: rgb(23,181,254);
|
||||
}
|
||||
.middle .box .navigation-carousel-person{
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
display: flex;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation{
|
||||
flex: 1;
|
||||
border: 1px solid rgb(130,200,250);
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul{
|
||||
height: 100%;
|
||||
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul :hover{
|
||||
color: rgb(23,181,254);
|
||||
background: rgb(222,238,253);
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul :hover a{
|
||||
color: rgb(23,181,254);
|
||||
background: rgb(222,238,253);
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul li{
|
||||
list-style: none;
|
||||
height: 10%;
|
||||
line-height: 50px;
|
||||
padding: 0 2em;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul li :hover{
|
||||
text-decoration: underline;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul li .layui-icon{
|
||||
float: right;
|
||||
text-decoration: none;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul li .li-content{
|
||||
display: none;
|
||||
height: 65%;
|
||||
width: 43.5%;
|
||||
border: 2px solid rgb(130,200,250);
|
||||
position: absolute;
|
||||
top: 30.1%;
|
||||
left: 24.6%;
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
background: white;
|
||||
padding: 1em;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul li .li-content :hover{
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
background: white;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul li .li-content .three-type{
|
||||
height: 100%;
|
||||
width: 60%;
|
||||
border-right: 1px solid rgb(224,224,224) ;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-right: 1em;
|
||||
float: left;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul li .li-content .three-type .type-1{
|
||||
flex: 1;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul li .li-content .three-type .type-1 .title{
|
||||
font-weight: bold;
|
||||
height: 2em;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul li .li-content .three-type .type-1 .title :hover{
|
||||
color: rgb(23,181,254);
|
||||
cursor: pointer;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul li .li-content .three-type .type-1 .title .more{
|
||||
font-size: 0.9em;
|
||||
font-weight: normal;
|
||||
float: right;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul li .li-content .three-type .type-1 .type-content{
|
||||
font-size: 0.9em;
|
||||
}.middle .box .navigation-carousel-person .navigation ul li .li-content .three-type .type-1 .type-content :hover{
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.middle .box .navigation-carousel-person .navigation ul li .li-content .three-type .type-1 .type-content span{
|
||||
margin-right: 1em;
|
||||
white-space:nowrap;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .navigation ul li .li-content .you-like{
|
||||
height: 100%;
|
||||
width: 37%;
|
||||
float: right;
|
||||
text-align: center;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .carousel{
|
||||
flex: 3;
|
||||
}
|
||||
.middle .box .navigation-carousel-person .person{
|
||||
flex: 1.5;
|
||||
}
|
||||
|
@ -17,14 +17,15 @@ body{
|
||||
display: flex;
|
||||
}
|
||||
.head .log{
|
||||
background: url("../img/E-Buy2.png");
|
||||
background: url("../img/E-Buy04.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 80% 50%;
|
||||
background-size: 100%;
|
||||
-moz-background-size: 80% 80%;
|
||||
background-position: center;
|
||||
height: 100%;
|
||||
width: 10%;
|
||||
margin-left: 8%;
|
||||
cursor: pointer;
|
||||
}
|
||||
.head .login-msg{
|
||||
text-align: center;
|
||||
|
BIN
src/main/webapp/static/img/E-BUY04.png
Normal file
After Width: | Height: | Size: 4.7 KiB |
BIN
src/main/webapp/static/img/E-BUY3.png
Normal file
After Width: | Height: | Size: 4.0 KiB |
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
BIN
src/main/webapp/static/img/E.png
Normal file
After Width: | Height: | Size: 5.6 KiB |
BIN
src/main/webapp/static/img/cart.png
Normal file
After Width: | Height: | Size: 5.4 KiB |
BIN
src/main/webapp/static/img/chufang01.jpg
Normal file
After Width: | Height: | Size: 151 KiB |
BIN
src/main/webapp/static/img/favorites.png
Normal file
After Width: | Height: | Size: 6.0 KiB |
BIN
src/main/webapp/static/img/logo1.png
Normal file
After Width: | Height: | Size: 4.1 KiB |
BIN
src/main/webapp/static/img/logo3.png
Normal file
After Width: | Height: | Size: 2.6 KiB |
BIN
src/main/webapp/static/img/logo4.png
Normal file
After Width: | Height: | Size: 6.6 KiB |
BIN
src/main/webapp/static/img/news.png
Normal file
After Width: | Height: | Size: 4.6 KiB |
BIN
src/main/webapp/static/img/service.png
Normal file
After Width: | Height: | Size: 7.4 KiB |
BIN
src/main/webapp/static/img/shop.png
Normal file
After Width: | Height: | Size: 5.2 KiB |
@ -0,0 +1,75 @@
|
||||
//打开个人信息
|
||||
function openPersonInfo() {
|
||||
$(".personInfo").css("display","inline");
|
||||
};
|
||||
//关闭个人信息
|
||||
function closePersonInfo() {
|
||||
$(".personInfo").css("display","none");
|
||||
};
|
||||
//打开消息
|
||||
function openPersonInfo1() {
|
||||
$(".news-content").css("display","inline");
|
||||
};
|
||||
//关闭消息
|
||||
function closePersonInfo1() {
|
||||
$(".news-content").css("display","none");
|
||||
};
|
||||
//打开购物车
|
||||
function openPersonInfo2() {
|
||||
$(".cart-content").css("display","inline");
|
||||
};
|
||||
//关闭购物车
|
||||
function closePersonInfo2() {
|
||||
$(".cart-content").css("display","none");
|
||||
};
|
||||
layui.use(['layer',"jquery","element"], function() {
|
||||
const layer = layui.layer
|
||||
,$ = layui.jquery
|
||||
,element = layui.element;
|
||||
|
||||
//判断登录
|
||||
let userInfo = JSON.parse(localStorage.getItem("userInfo"));
|
||||
console.log(userInfo);
|
||||
if (userInfo.user_name != "" || userInfo.user_name != null){
|
||||
$(".login-information").css("display","inline");
|
||||
$(".not-login-information").css("display","none");
|
||||
$(".login-text-username").html(userInfo.nick_name);
|
||||
|
||||
//个人信息
|
||||
$(".login-text").attr("onmouseover","openPersonInfo()");
|
||||
$(".login-text").attr("onmouseout","closePersonInfo()");
|
||||
|
||||
//消息
|
||||
$(".news").attr("onmouseover","openPersonInfo1()");
|
||||
$(".news").attr("onmouseout","closePersonInfo1()");
|
||||
|
||||
//购物车
|
||||
$(".cart").attr("onmouseover","openPersonInfo2()");
|
||||
$(".cart").attr("onmouseout","closePersonInfo2()");
|
||||
|
||||
//判断是否商家
|
||||
if (userInfo.user_type == "01") {
|
||||
$(".set-up-shop").css("display","none");
|
||||
$(".business").css("display","inline");
|
||||
}
|
||||
}
|
||||
|
||||
//联系客服
|
||||
$(".service").on("click",function () {
|
||||
layer.msg("功能正在完善,联系客服:15006732580!")
|
||||
});
|
||||
|
||||
//搜索回车触发
|
||||
$("body").keydown(function () {
|
||||
|
||||
if (window.event.keyCode==13) {
|
||||
//如果发生了按下回车键事件,回车键对应的编号是13
|
||||
$(".search-text").trigger("click"); //则激活登录按钮的click事件
|
||||
}
|
||||
});
|
||||
|
||||
//搜索
|
||||
$(".search-text").on("click",function () {
|
||||
layer.msg($(".search-box-input").val())
|
||||
})
|
||||
})
|
@ -19,8 +19,10 @@ layui.use(['layer',"jquery"], function() {
|
||||
success: function (data) {
|
||||
let msg = data.msg;
|
||||
if (msg == "登录成功!") {
|
||||
localStorage.setItem("userInfo",JSON.stringify(data));
|
||||
//登录成功
|
||||
console.log(msg);
|
||||
console.log(localStorage.setItem("userInfo",JSON.stringify(data)));
|
||||
window.location.href = "/ebuy/index";
|
||||
} else {
|
||||
//登录失败
|
||||
@ -56,6 +58,7 @@ layui.use(['layer',"jquery"], function() {
|
||||
}
|
||||
});
|
||||
|
||||
//log去首页
|
||||
$(".log").on("click",function () {
|
||||
window.location.href="/ebuy/index";
|
||||
})
|
||||
|