webfront / zhenwei · 提交

转到一个项目

作者 乔爽
提交 959d3bdd81b33859eabcbafc319b3c4c7cad302b 1 个父辈 4eeadbb2

update function

内嵌 并排对比
正在显示 1 个修改的文件 包含 18 行增加 和 7 行删除
@@ -2,7 +2,7 @@ @@ -2,7 +2,7 @@
2 <html lang="en"> 2 <html lang="en">
3 <head> 3 <head>
4 <meta charset="UTF-8"> 4 <meta charset="UTF-8">
5 - <title>首页</title> 5 + <title>登录</title>
6 <!--<meta name="viewport" content="width=device-width, initial-scale=1" />--> 6 <!--<meta name="viewport" content="width=device-width, initial-scale=1" />-->
7 <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" /> 7 <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
8 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 8 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
@@ -52,8 +52,9 @@ @@ -52,8 +52,9 @@
52 52
53 </div> 53 </div>
54 54
  55 + <div class="bottom_box">
55 <!--登录输入框--> 56 <!--登录输入框-->
56 - <div class="bottom" style="display: none"> 57 + <div class="bottom" style="display: flex">
57 <div class="bottom_item"> 58 <div class="bottom_item">
58 <div class="iconfont icon-Fill"></div> 59 <div class="iconfont icon-Fill"></div>
59 <input type="text" placeholder="请输入手机号"> 60 <input type="text" placeholder="请输入手机号">
@@ -80,7 +81,7 @@ @@ -80,7 +81,7 @@
80 </div> 81 </div>
81 82
82 <!--注册输入框--> 83 <!--注册输入框-->
83 - <div class="bottom" style="display: flex"> 84 + <div class="bottom" style="display: none">
84 <div class="bottom_item "> 85 <div class="bottom_item ">
85 <div class="iconfont icon-Fill"></div> 86 <div class="iconfont icon-Fill"></div>
86 <input type="text" placeholder="请输入手机号"> 87 <input type="text" placeholder="请输入手机号">
@@ -113,13 +114,23 @@ @@ -113,13 +114,23 @@
113 已有账号，立即登录 114 已有账号，立即登录
114 </div> 115 </div>
115 </div> 116 </div>
116 -  
117 - 117 + </div>
118 118
119 119
120 120
121 </div> 121 </div>
122 -  
123 - 122 +<script src="js/jquery.min.js"></script>
  123 +
  124 +<script>
  125 + //颜色切换
  126 + $(".mid_item").click(function () {
  127 + var index = $(this).index()
  128 + $(this).addClass("item_color").siblings(".mid_item").removeClass("item_color")
  129 + // 内容切换
  130 + $(".mid_item").eq($(".bottom_box>.bottom").index()).addClass("on").siblings().removeClass("on")
  131 + $(".bottom_box>.bottom").css("display","none").eq($(this).index()).css("display","flex");
  132 + })
  133 +
  134 +</script>
124 </body> 135 </body>
125 </html> 136 </html>