作者 乔爽

update

... ... @@ -52,9 +52,12 @@ body{
display: flex;
justify-content: center;
/*background:linear-gradient(-85deg,rgba(110,15,119,1) 0%, rgba(3,24,165,1) 100%);*/
/*-webkit-background-clip:text;*/
/*-webkit-text-fill-color:transparent;*/
}
.item_color{
color: red;
color: #0318A5;
/*background:linear-gradient(-85deg,rgba(110,15,119,1) 0%, rgba(3,24,165,1) 100%);*/
/*-webkit-background-clip:text;*/
/*-webkit-text-fill-color:transparent;*/
... ... @@ -65,7 +68,7 @@ body{
height: 0.02rem;
background:linear-gradient(-85deg,rgba(110,15,119,1),rgba(3,24,165,1));
/*-webkit-background-clip:text;*/
-webkit-text-fill-color:transparent;
/*-webkit-text-fill-color:transparent;*/
position: absolute;
bottom: 0;
}
... ... @@ -188,3 +191,21 @@ body{
color: #b3b3b3;
}
/*土司弹框*/
.pop_fn{
position: fixed;
top: -2rem;
left: 0;
right: 0;
width: 3.74rem;
height: 0.82rem;
margin: 0 auto;
text-align: center;
line-height: 0.82rem;
color: #fff;
font-size: 0.24rem;
/*background: #352D32;*/
background:rgba(0,0,0,0.4);
transition: 1.2s;
border-radius: 0.36rem;
}
... ...
... ... @@ -57,7 +57,7 @@
<div class="bottom" style="display: flex">
<div class="bottom_item">
<div class="iconfont icon-Fill"></div>
<input type="text" placeholder="请输入手机号">
<input type="text" placeholder="请输入手机号" class="phone">
</div>
<div class="bottom_item">
<div class="iconfont icon-mima"></div>
... ... @@ -65,7 +65,7 @@
</div>
<!--登录框-->
<div class="bottom_sub">
<div class="bottom_sub login">
立即登录
</div>
... ... @@ -84,7 +84,7 @@
<div class="bottom" style="display: none">
<div class="bottom_item ">
<div class="iconfont icon-Fill"></div>
<input type="text" placeholder="请输入手机号">
<input type="text" placeholder="请输入手机号" class="phone">
</div>
<!--输入验证码-->
<div class="bottom_small margin_item">
... ... @@ -105,7 +105,7 @@
</div>
<!--登录框-->
<div class="bottom_sub margin_item">
<div class="bottom_sub margin_item register">
立即注册
</div>
... ... @@ -115,9 +115,8 @@
</div>
</div>
</div>
<!--土司弹框-->
<div class="pop_fn"></div>
</div>
<script src="js/jquery.min.js"></script>
... ... @@ -127,10 +126,41 @@
var index = $(this).index()
$(this).addClass("item_color").siblings(".mid_item").removeClass("item_color")
// 内容切换
$(".mid_item").eq($(".bottom_box>.bottom").index()).addClass("on").siblings().removeClass("on")
$(".mid_item").eq($(".bottom_box>.bottom").index()).siblings()
$(".bottom_box>.bottom").css("display","none").eq($(this).index()).css("display","flex");
})
//土司弹框
function popup(message) {
$('.pop_fn').css('top', 3 + 'rem').html(message);
setTimeout(function() {
$('.pop_fn').css('top', '-' + 2 + 'rem').html(message);
}, 1800)
}
//登录功能正则验证
$(".login").click(function () {
var phone_number = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
var newphone = $(".phone").val();
if (!phone_number.test(newphone)){
popup("手机号错误")
}else{
popup("登录成功")
}
})
//注册功能正则验证
$(".register").click(function () {
var phone_number = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
var newphone = $(".phone").val();
if (!phone_number.test(newphone)){
popup("手机号错误")
}else{
popup("登录成功")
}
})
</script>
</body>
</html>
... ...
... ... @@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<title>首页</title>
<title>个人中心</title>
<!--<meta name="viewport" content="width=device-width, initial-scale=1" />-->
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
... ... @@ -408,6 +408,27 @@
$('.item_8').click(function () {
window.location.href = "cgdj.html"
})
//苹果input自动下滑兼容
$("input").blur(function(){
setTimeout(function() {
var scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0;
window.scrollTo(0, Math.max(scrollHeight - 1, 0));
}, 300);
})
//聚焦监听
$('input').focus(function() {
if((/Android/gi).test(navigator.userAgent)) {
window.addEventListener('resize', function() {
if(document.activeElement.tagName == 'INPUT' ||
document.activeElement.tagName == 'TEXTAREA') {
window.setTimeout(function() {
document.activeElement.scrollIntoViewIfNeeded();
}, 0);
}
});
}
})
</script>
</body>
</html>
... ...
... ... @@ -613,7 +613,7 @@ $(document).ready(function () {
//-------------酒店循环---------------
var page = 0;
// 每次循环展示10个
var size = 6 ;
var size = 3;
$('.hotel').dropload({
scrollArea : window,
domUp : {
... ... @@ -716,8 +716,8 @@ $(document).ready(function () {
//--------------美食循环---------------
var page2 = 0;
// 每次循环展示10个
var size2 = 1 ;
// 每次循环展示3个
var size2 = 3;
$('.cate').dropload({
scrollArea : window,
domUp : {
... ... @@ -806,8 +806,8 @@ $(document).ready(function () {
//--------------天津旅游---------------
var page3 = 0;
// 每次循环展示10个
var size3 = 6;
// 每次循环展示3个
var size3 = 3;
$('.travel').dropload({
scrollArea : window,
domUp : {
... ...