修改首页banner为全屏展示

css/style.css

@@ -222,7 +222,6 @@
   justify-content: center;
   align-items: center;
   width: 100%;
-  height: 7.2rem;
   background-repeat: no-repeat;
   background-position: center center;
   background-size: cover;

css/style.less

@@ -283,7 +283,6 @@
         justify-content: center;
         align-items: center;
         width: 100%;
-        height: 7.2rem;
         background-repeat: no-repeat;
         background-position: center center;
         background-size: cover;

index.html

@@ -121,6 +121,14 @@
     <div class="footer"></div>
 
     <script src="js/main.js"></script>
+
+    <script>
+        $(function () {
+            if (!isMobile) {
+                $('.main-banner .item').css('height', window.innerHeight + 'px');
+            }
+        });
+    </script>
 </body>
 
 </html>

js/main.js

@@ -7,6 +7,7 @@ let isClose = true,
     heaerMenuGroup = $('.menu-group'),
     headerMask = $('.menu-mask'),
     headerMenuBtn = $('.btn-img'),
+    isMobile = $(window).width() <= 768,
     currentRem = 0;
 
 function getRem() {
@@ -20,10 +21,10 @@ function rszcal() {
 
 function headerEffect() {
     let t = $(document).scrollTop(), flag;
-    if ($(window).width() > 768) {
+    if (!isMobile) {
         flag = t > 4 * currentRem;
     } else {
-        flag = t > 0.6 * currentRem;
+        flag = t > 2.5 * currentRem;
     }
     if (flag) {
         header.removeClass('style1').addClass('style2');