前端样式完成

master
Lee-1203 2022-05-12 13:44:34 +08:00
parent 010880afca
commit 5b6dc7f0c0
4 changed files with 34 additions and 17 deletions

View File

@ -605,7 +605,8 @@
margin-bottom: 32px;
}
.login-btn{
.login-btn,
.register-btn{
width: calc(88% - 136px);
height: 48px;
margin: 25px 0 40px 136px;
@ -1292,11 +1293,11 @@
/* 提示框 */
.tips-box{
display: none;
min-width: 160px;
max-width: 240px;
min-width: 140px;
max-width: 180px;
background-color: #fff;
border-radius: 3px;
padding: 10px 10px;
padding: 10px 20px;
text-align: center;
position: fixed;
top: 20%;
@ -1310,8 +1311,8 @@
}
.tips-box>p{
font-size: 14px;
line-height: 1.8;
margin-top: 4px;
line-height: 1.6;
margin-top: 6px;
opacity: .8;
}

View File

@ -57,20 +57,30 @@ jQuery(function($){
autoplay:false,
})
// 弹框事件
// 登录
if($('.login-btn').length > 0){
$('.login-btn').click(function() {
$('.nav-bg').css('display','block');
$('.tips-box').css('display','block');
setTimeout(function() {
$('.nav-bg').css('display','none');
$('.tips-box').css('display','none');
call();
},1000)
openTips('登录成功,立即跳转到首页',1000);
})
}
// 注册
if($('.register-btn').length > 0){
$('.register-btn').click(function() {
openTips('注册成功,立即跳转到登录页',1000);
})
}
// 记住密码
// 提示弹窗
function openTips(val,closeTime='1500'){
$('.nav-bg').css('display','block');
$('.tips-box').css('display','block');
$('.tips-box').find('p').text(val);
setTimeout(function() {
$('.nav-bg').css('display','none');
$('.tips-box').css('display','none');
$('.tips-box').find('p').text('');
},closeTime)
}

View File

@ -102,7 +102,7 @@
<!-- 提示框 -->
<div class="tips-box">
<span>提 示</span>
<p>密码位数不正确</p>
<p></p>
</div>
</body>
</html>

View File

@ -81,7 +81,7 @@
<input type="txt" name="pwd" placeholder="">
</li>
</ul>
<button class="login-btn register-btn">立即注册</button>
<button class="register-btn">立即注册</button>
<div class="agree register-agree">
<span><em class="agreement"></em>我已阅读并同意相关服务条款和隐私政策<ins class="icon-arrow"></ins></span>
</div>
@ -104,5 +104,11 @@
<div class="foot-record">Copyright© xxxxxxxxx.com All rights reserved<a href="https://beian.miit.gov.cn">蜀ICP备11111111号-2</a>技术支持:<a href="">大向天成</a></div>
</div>
</div>
<!-- 提示框 -->
<div class="tips-box">
<span>提 示</span>
<p>注册成功,自动跳转到登录页</p>
</div>
</body>
</html>