index 轮播

.idea/workspace.xml

@@ -3,7 +3,14 @@
   <component name="ChangeListManager">
     <list default="true" id="82570a17-8430-4238-ae79-81bbbd2de81f" name="Default Changelist" comment="">
       <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/index.html" beforeDir="false" afterPath="$PROJECT_DIR$/index.html" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/css/components.css" beforeDir="false" afterPath="$PROJECT_DIR$/css/components.css" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/css/components.less" beforeDir="false" afterPath="$PROJECT_DIR$/css/components.less" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/css/exam_list.css" beforeDir="false" afterPath="$PROJECT_DIR$/css/exam_list.css" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/h_exam/exam_list.html" beforeDir="false" afterPath="$PROJECT_DIR$/h_exam/exam_list.html" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/h_news/news_list.html" beforeDir="false" afterPath="$PROJECT_DIR$/h_news/news_list.html" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/js/components.js" beforeDir="false" afterPath="$PROJECT_DIR$/js/components.js" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/js/exam_list.js" beforeDir="false" afterPath="$PROJECT_DIR$/js/exam_list.js" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/js/new_list.js" beforeDir="false" afterPath="$PROJECT_DIR$/js/new_list.js" afterDir="false" />
     </list>
     <option name="EXCLUDED_CONVERTED_TO_IGNORED" value="true" />
     <option name="SHOW_DIALOG" value="false" />
@@ -87,6 +94,18 @@
         </counts>
       </usages-collector>
     </session>
+    <session id="-1918643531">
+      <usages-collector id="statistics.file.extensions.open">
+        <counts>
+          <entry key="less" value="2" />
+        </counts>
+      </usages-collector>
+      <usages-collector id="statistics.file.types.open">
+        <counts>
+          <entry key="Less" value="2" />
+        </counts>
+      </usages-collector>
+    </session>
   </component>
   <component name="FileEditorManager">
     <leaf SIDE_TABS_SIZE_LIMIT_KEY="300">
@@ -108,7 +127,7 @@
           </provider>
         </entry>
       </file>
-      <file pinned="false" current-in-tab="true">
+      <file pinned="false" current-in-tab="false">
         <entry file="file://$PROJECT_DIR$/imgs/favicon.ico">
           <provider selected="true" editor-type-id="images" />
         </entry>
@@ -125,12 +144,21 @@
       <file pinned="false" current-in-tab="false">
         <entry file="file://$PROJECT_DIR$/h_news/news_detail.html">
           <provider selected="true" editor-type-id="text-editor">
-            <state relative-caret-position="198">
+            <state relative-caret-position="176">
               <caret line="6" column="72" selection-start-line="6" selection-start-column="72" selection-end-line="6" selection-end-column="72" />
             </state>
           </provider>
         </entry>
       </file>
+      <file pinned="false" current-in-tab="false">
+        <entry file="file://$PROJECT_DIR$/css/components.less">
+          <provider selected="true" editor-type-id="text-editor">
+            <state relative-caret-position="49">
+              <caret line="745" column="25" lean-forward="true" selection-start-line="745" selection-start-column="25" selection-end-line="745" selection-end-column="25" />
+            </state>
+          </provider>
+        </entry>
+      </file>
       <file pinned="false" current-in-tab="false">
         <entry file="file://$PROJECT_DIR$/h_exam/exam_detail.html">
           <provider selected="true" editor-type-id="text-editor" />
@@ -141,11 +169,11 @@
           <provider selected="true" editor-type-id="text-editor" />
         </entry>
       </file>
-      <file pinned="false" current-in-tab="false">
+      <file pinned="false" current-in-tab="true">
         <entry file="file://$PROJECT_DIR$/h_exam/exam_list.html">
           <provider selected="true" editor-type-id="text-editor">
-            <state relative-caret-position="429">
-              <caret line="13" column="18" selection-start-line="13" selection-start-column="18" selection-end-line="13" selection-end-column="18" />
+            <state relative-caret-position="264">
+              <caret line="8" column="35" lean-forward="true" selection-start-line="8" selection-start-column="35" selection-end-line="8" selection-end-column="35" />
             </state>
           </provider>
         </entry>
@@ -217,27 +245,12 @@
             <path>
               <item name="gs_try" type="b2602c69:ProjectViewProjectNode" />
               <item name="gs_try" type="462c0819:PsiDirectoryNode" />
-              <item name="h_exam" type="462c0819:PsiDirectoryNode" />
-            </path>
-            <path>
-              <item name="gs_try" type="b2602c69:ProjectViewProjectNode" />
-              <item name="gs_try" type="462c0819:PsiDirectoryNode" />
-              <item name="h_news" type="462c0819:PsiDirectoryNode" />
-            </path>
-            <path>
-              <item name="gs_try" type="b2602c69:ProjectViewProjectNode" />
-              <item name="gs_try" type="462c0819:PsiDirectoryNode" />
-              <item name="imgs" type="462c0819:PsiDirectoryNode" />
-            </path>
-            <path>
-              <item name="gs_try" type="b2602c69:ProjectViewProjectNode" />
-              <item name="gs_try" type="462c0819:PsiDirectoryNode" />
-              <item name="js" type="462c0819:PsiDirectoryNode" />
+              <item name="css" type="462c0819:PsiDirectoryNode" />
             </path>
             <path>
               <item name="gs_try" type="b2602c69:ProjectViewProjectNode" />
               <item name="gs_try" type="462c0819:PsiDirectoryNode" />
-              <item name="xgk" type="462c0819:PsiDirectoryNode" />
+              <item name="h_exam" type="462c0819:PsiDirectoryNode" />
             </path>
           </expand>
           <select />
@@ -353,13 +366,20 @@
       <option name="project" value="LOCAL" />
       <updated>1629170537984</updated>
     </task>
-    <option name="localTasksCounter" value="11" />
+    <task id="LOCAL-00011" summary="index 轮播">
+      <created>1629170977232</created>
+      <option name="number" value="00011" />
+      <option name="presentableId" value="LOCAL-00011" />
+      <option name="project" value="LOCAL" />
+      <updated>1629170977232</updated>
+    </task>
+    <option name="localTasksCounter" value="12" />
     <servers />
   </component>
   <component name="ToolWindowManager">
     <frame x="-8" y="-8" width="1936" height="1056" extended-state="6" />
     <layout>
-      <window_info active="true" content_ui="combo" id="Project" order="0" visible="true" weight="0.15884861" />
+      <window_info content_ui="combo" id="Project" order="0" visible="true" weight="0.15884861" />
       <window_info id="Structure" order="1" side_tool="true" weight="0.25" />
       <window_info id="Favorites" order="2" side_tool="true" />
       <window_info anchor="bottom" id="Message" order="0" />
@@ -370,7 +390,7 @@
       <window_info anchor="bottom" id="Inspection" order="5" weight="0.4" />
       <window_info anchor="bottom" id="TODO" order="6" />
       <window_info anchor="bottom" id="Docker" order="7" show_stripe_button="false" />
-      <window_info anchor="bottom" id="Version Control" order="8" weight="0.40455532" />
+      <window_info active="true" anchor="bottom" id="Version Control" order="8" visible="true" weight="0.40455532" />
       <window_info anchor="bottom" id="Database Changes" order="9" show_stripe_button="false" />
       <window_info anchor="bottom" id="Event Log" order="10" side_tool="true" />
       <window_info anchor="bottom" id="Terminal" order="11" weight="0.3264642" />
@@ -409,6 +429,12 @@
     <option name="version" value="1" />
   </component>
   <component name="Vcs.Log.History.Properties">
+    <option name="COLUMN_WIDTH">
+      <map>
+        <entry key="2" value="83" />
+        <entry key="3" value="101" />
+      </map>
+    </option>
     <option name="COLUMN_ORDER">
       <list>
         <option value="0" />
@@ -479,20 +505,10 @@
     <entry file="file://$PROJECT_DIR$/imgs/app_dowload.png">
       <provider selected="true" editor-type-id="images" />
     </entry>
-    <entry file="file://$PROJECT_DIR$/imgs/favicon.ico">
-      <provider selected="true" editor-type-id="images" />
-    </entry>
     <entry file="file://$PROJECT_DIR$/33" />
     <entry file="file://$PROJECT_DIR$/imgs/bg.png">
       <provider selected="true" editor-type-id="images" />
     </entry>
-    <entry file="file://$PROJECT_DIR$/h_news/news_detail.html">
-      <provider selected="true" editor-type-id="text-editor">
-        <state relative-caret-position="198">
-          <caret line="6" column="72" selection-start-line="6" selection-start-column="72" selection-end-line="6" selection-end-column="72" />
-        </state>
-      </provider>
-    </entry>
     <entry file="file://$PROJECT_DIR$/xgk/xgk.html">
       <provider selected="true" editor-type-id="text-editor">
         <state relative-caret-position="99">
@@ -517,5 +533,29 @@
         </state>
       </provider>
     </entry>
+    <entry file="file://$PROJECT_DIR$/imgs/favicon.ico">
+      <provider selected="true" editor-type-id="images" />
+    </entry>
+    <entry file="file://$PROJECT_DIR$/h_news/news_detail.html">
+      <provider selected="true" editor-type-id="text-editor">
+        <state relative-caret-position="176">
+          <caret line="6" column="72" selection-start-line="6" selection-start-column="72" selection-end-line="6" selection-end-column="72" />
+        </state>
+      </provider>
+    </entry>
+    <entry file="file://$PROJECT_DIR$/css/components.less">
+      <provider selected="true" editor-type-id="text-editor">
+        <state relative-caret-position="49">
+          <caret line="745" column="25" lean-forward="true" selection-start-line="745" selection-start-column="25" selection-end-line="745" selection-end-column="25" />
+        </state>
+      </provider>
+    </entry>
+    <entry file="file://$PROJECT_DIR$/h_exam/exam_list.html">
+      <provider selected="true" editor-type-id="text-editor">
+        <state relative-caret-position="264">
+          <caret line="8" column="35" lean-forward="true" selection-start-line="8" selection-start-column="35" selection-end-line="8" selection-end-column="35" />
+        </state>
+      </provider>
+    </entry>
   </component>
 </project>

css/components.css

@@ -153,7 +153,7 @@ body::-webkit-scrollbar-track {
 }
 .header .my-province {
   margin-left: 5px;
-  margin-top: 30px;
+  margin-top: 20px;
 }
 @media screen and (max-width: 768px) {
   .header .my-province {

css/components.less

@@ -198,7 +198,7 @@ body {
   // 通用样式
   .my-province {
     margin-left: 5px;
-    margin-top: 30px;
+    margin-top: 20px;
 
     @media screen and (max-width:768px) {
       & {

css/exam_list.css

@@ -1,4 +1,5 @@
 .body {
+  margin-top: 90px;
   padding-top: 0px;
   transform: translateY(-10px);
 }

h_exam/exam_list.html

@@ -39,6 +39,12 @@
             <img src="../imgs/app.png" alt=""></a>
           <!-- <span>大联考</span> -->
         </div>
+        <div class="my-province pull-left">
+          <span>全国</span><i class="glyphicon glyphicon-chevron-down"></i>
+          <div data-province="true">
+            <i class="glyphicon glyphicon-play icon-play"></i>
+          </div>
+        </div>
         <div data-app="download" class="app pull-right">
           <a href="http://app.gaokaoapp.net" draggable="false">
             <img src="../imgs/app_dowload.png" alt="大联考App下载" draggable="false"><br>
@@ -52,73 +58,16 @@
           <div id="listbutton" class="glyphicon glyphicon-th-list button"></div>
         </div>
       </div>
-      <div class="hb-item">
-        <!-- @大屏修改下拉菜单 -->
-        <div id="nav" class="nav">
-          <div class="nav-item">
-            <!-- active 表明当前页面属于那个动作分类 -->
-            <a class="active" href="javascript:;" draggable="false">首页</a>
-            <ul class="nav-ul">
-            </ul>
-          </div>
-          <div class="nav-item">
-            <a href="javascript:;" draggable="false">新高考<i class="glyphicon glyphicon-chevron-down"></i></a>
-            <ul class="nav-ul xingaokao">
-              <li class="nav-li xingaokao"><a href="#" target="_blank" draggable="false">新高考</a></li>
-            </ul>
-          </div>
-          <div class="nav-item">
-            <a href="javascript:;" draggable="false">机构联考<i class="glyphicon glyphicon-chevron-down"></i></a>
-            <ul class="nav-ul">
-              <li class="nav-li"><a href="#" target="_blank" draggable="false">机构联考</a></li>
-            </ul>
-          </div>
-          <div class="nav-item">
-            <a href="javascript:;" draggable="false">模拟考试<i class="glyphicon glyphicon-chevron-down"></i></a>
-            <ul class="nav-ul">
-              <li class="nav-li"><a href="#" target="_blank" draggable="false">模拟考试</a></li>
-            </ul>
-          </div>
-        </div>
-      </div>
     </div>
   </div>
-  <!-- components 共用菜单 -->
   <!-- @小屏幕 下拉菜单 -->
   <div id="nav-sm" class="nav-sm-noheight">
-    <ul>
-      <!-- active 表明当前页面属于那个动作分类 -->
-      <li><a class="nav-sm-title active" href="javascript:;" draggable="false">首页</a>
-        <ul class="nav-sm-ul"></ul>
-      </li>
-      <li>
-        <a class="nav-sm-title" href="javascript:;"" draggable=" false">新高考</a>
-        <ul class="nav-sm-ul">
-          <li class="nav-sm-li"><a href="/" target="_blank" draggable="false">新item 1</a></li>
-          <li class="nav-sm-li"><a href="/" target="_blank" draggable="false">新item 1</a></li>
-          <li class="nav-sm-li"><a href="/" target="_blank" draggable="false">新item 1</a></li>
-          <li class="nav-sm-li"><a href="/" target="_blank" draggable="false">新item 1</a></li>
-        </ul>
-      </li>
-      <li>
-        <a class="nav-sm-title" href="javascript:;" draggable="false">机构联考</a>
-        <ul class="nav-sm-ul">
-          <li class="nav-sm-li"><a href="/" target="_blank" draggable="false">模拟考试</a></li>
-          <li class="nav-sm-li"><a href="/" target="_blank" draggable="false">新item 1</a></li>
-          <li class="nav-sm-li"><a href="/" target="_blank" draggable="false">新item 1</a></li>
-          <li class="nav-sm-li"><a href="/" target="_blank" draggable="false">新item 1</a></li>
-        </ul>
-      </li>
-      <li>
-        <a class="nav-sm-title" href="javascript:;" draggable="false">模拟考试</a>
-        <ul class="nav-sm-ul">
-          <li class="nav-sm-li"><a href="/" target="_blank" draggable="false">模拟考试</a></li>
-          <li class="nav-sm-li"><a href="/" target="_blank" draggable="false">新item 1</a></li>
-          <li class="nav-sm-li"><a href="/" target="_blank" draggable="false">新item 1</a></li>
-          <li class="nav-sm-li"><a href="/" target="_blank" draggable="false">新item 1</a></li>
-        </ul>
-      </li>
-    </ul>
+    <div class="my-province">
+      <span>全国</span><i class="glyphicon glyphicon-chevron-down"></i>
+      <div data-province="true">
+        <i class="glyphicon glyphicon-play icon-play"></i>
+      </div>
+    </div>
   </div>
   <div id="body" class="container">
     <div class="row">

h_news/news_list.html

@@ -10,6 +10,7 @@
   <link rel="shortcut icon" type="image/x-icon" href="../imgs/favicon.ico">
   <title>热点资讯-大联考网页版</title>
   <script src="../js/jquery.js"></script>
+  <script type="text/javascript" src="../js/jquery.lazyload.min.js"></script>
   <script src="../bootstrap/bootstrap.min.js"></script>
   <link rel="stylesheet" href="../bootstrap/bootstrap.min.css">
   <link rel="stylesheet" href="../css/components.css">
@@ -56,7 +57,8 @@
           <div class="my-list list">
             <a target="_blank" href="http://www.gaokaoapp.net" class="list-item">
               <div class="item-img">
-                <img src="../imgs/app_dowload.png" alt="大联考">
+                <!-- 懒加载图片 除非静态页面含有大量图片 否则没有必要使用 -->
+                <img data-original="../imgs/app_dowload.png" alt="大联考">
               </div>
               <div class="item-detail">
                 <div class="title">大联考APP热点资讯</div>
@@ -83,9 +85,9 @@
     <div>分享</div>
     <ul>
       <li>分享到</li>
-      <li><img src="../imgs/qq.png" alt="QQ">QQ</li>
-      <li><img src="../imgs/weixin.png" alt="微信">微信</li>
-      <li><img src="../imgs/weibo.png" alt="微博">微博</li>
+      <li><img src="../imgs/qq.png" alt="qq">QQ</li>
+      <!-- <li><img src="./imgs/weixin.png" alt="qq">微信</li> -->
+      <li><img src="../imgs/weibo.png" alt="qq">微博</li>
     </ul>
   </div>
   <!-- 下载app -->

js/components.js

@@ -389,7 +389,8 @@ $(function () {
   // 底部弹出框
   let lis = $("[data-province='true']").append(province(globaldata.province)).find("li");
   Array.prototype.slice.call(lis).forEach(item => {
-    $(item).click(function () {
+    $(item).click(function (e) {
+      e.stopPropagation();
       let text = $(this).text();
       if (text == "默认") {
         $(".my-province div[data-province='true']").hide();
@@ -399,9 +400,49 @@ $(function () {
     })
   })
 
-  function province_show () {
+  function province_show (e) {
+    e.stopPropagation();
     $(".my-province div[data-province='true']").show().unbind("mouseleave").mouseleave(function () { $(this).hide() });
   }
   $(".my-province>span").click(province_show);
   $(".my-province>i").click(province_show);
+})
+
+// 全局添加路径解析
+$(function () {
+  var r = {
+    protocol: /([^\/]+:)\/\/(.*)/i,
+    host: /(^[^\:\/]+)((?:\/|:|$)?.*)/,
+    port: /\:?([^\/]*)(\/?.*)/,
+    pathname: /([^\?#]+)(\??[^#]*)(#?.*)/
+  };
+
+  function parseUrl (url) {
+    var tmp, res = {};
+    res["href"] = url;
+    for (p in r) {
+      tmp = r[p].exec(url);
+      res[p] = tmp[1];
+      url = tmp[2];
+      if (url === "") {
+        url = "/";
+      }
+      if (p === "pathname") {
+        res["pathname"] = tmp[1];
+        res["search"] = tmp[2];
+        res["hash"] = tmp[3];
+      }
+    }
+    let param = res.search.replace('?', '').split("&");
+    let params = {};
+    param.forEach(item => {
+      let arr = item.split("=");
+      params[arr[0]] = arr[1]
+    })
+    res["query"] = params;
+    return res;
+  };
+  window["lxd"] = {
+    parseUrl
+  }
 })

js/exam_list.js

@@ -2,7 +2,13 @@ $(function () {
   const globaldata = {
     active: 0,
   }
-  $(".my-nav").click(function (e) {
+  let params = lxd.parseUrl(window.location.href).query,
+    my_nav = $(".my-nav"), my_nav_lis = my_nav.find("li");
+  params["id"] >= my_nav_lis.length ? params["id"] = 0 : params["id"];
+  my_nav_lis.removeClass("active");
+  $(my_nav_lis[params["id"]]).addClass("active");
+  my_nav.click(function (e) {
+    if (e.target.className == "my-nav") return false;
     let active = Array.prototype.slice.call($(this).find("li")).indexOf(e.target);
     if (active == globaldata.active) return false;
     globaldata.active = active;
@@ -49,4 +55,8 @@ $(function () {
       }, 2000)
     })
   }
+  // 小屏幕 点击背景关闭 弹窗
+  $("#nav-sm").click(function () {
+    $(".my-province div[data-province='true']").hide();
+  })
 })

js/new_list.js

@@ -1,4 +1,6 @@
 $(function () {
+  // 图片懒加载
+  $("img").lazyload();
   // 显示区高度
   let ch = document.documentElement.clientHeight || document.body.clientHeight;
   let lock = false;
@@ -19,7 +21,7 @@ $(function () {
   function data () {
     let str = `<a target="_blank" href="https://www.baidu.com" class="list-item">
     <div class="item-img">
-      <img src="https://imgs.app.gaokaozhitongche.com/uploads/img/2021/0809/1628514522805675.png!cover2"
+      <img data-original="../imgs/app_dowload.png"
         alt="">
     </div>
     <div class="item-detail">