소스 검색

修改banner动画,去掉多余小圆点

tanxue 5 년 전
부모
커밋
66de581b9e
2개의 변경된 파일3개의 추가작업 그리고 31개의 파일을 삭제
  1. 3 27
      src/assets/css/cus-website/cus-website-page.scss
  2. 0 4
      src/views/client/Index.vue

+ 3 - 27
src/assets/css/cus-website/cus-website-page.scss

@@ -74,10 +74,6 @@
             .banner-i-run i:nth-child(3){width:7px;height:7px;bottom: 220px;left: 110px;opacity: 0;animation: 5s bannerRunI3 ease 3s infinite;-webkit-animation: 5s bannerRunI3 ease 3s infinite;-moz-animation: 5s bannerRunI3 ease infinite;-o-animation: 5s bannerRunI3 ease infinite;}
             .banner-i-run i:nth-child(4){width:9px;height:9px;bottom: 300px;left: 130px;opacity: 0;animation: 5s bannerRunI4 ease 4s infinite;-webkit-animation: 5s bannerRunI4 ease 4s infinite;-moz-animation: 5s bannerRunI4 ease infinite;-o-animation: 5s bannerRunI4 ease infinite;}
             .banner-i-run i:nth-child(5){width:6px;height:6px;bottom: 310px;left: 70px;opacity: 0;animation: 5s bannerRunI5 ease 5s infinite;-webkit-animation: 5s bannerRunI5 ease 5s infinite;-moz-animation: 5s bannerRunI5 ease infinite;-o-animation: 5s bannerRunI5 ease infinite;}
-           /* .banner-i-run i:nth-child(6){width:5px;height:5px;top: 150px;left: 150px;opacity: 0;animation: 2s bannerRunI6 ease 5s infinite;-webkit-animation: 2s bannerRunI6 ease 5s infinite;-moz-animation: 5s bannerRunI6 ease infinite;-o-animation: 5s bannerRunI6 ease infinite;}
-            .banner-i-run i:nth-child(7){width:6px;height:6px;top: 110px;left: 170px;opacity: 0;animation: 3s bannerRunI7 ease 6s infinite;-webkit-animation: 3s bannerRunI7 ease 6s infinite;-moz-animation: 5s bannerRunI7 ease infinite;-o-animation: 5s bannerRunI7 ease infinite;}
-            .banner-i-run i:nth-child(8){width:8px;height:8px;top: 80px;left: 120px;opacity: 0;animation: 4s bannerRunI8 ease 7s infinite;-webkit-animation: 4s bannerRunI8 ease 7s infinite;-moz-animation: 5s bannerRunI8 ease infinite;-o-animation: 5s bannerRunI8 ease infinite;}
-            .banner-i-run i:nth-child(9){width:6px;height:6px;top: 50px;left: 140px;opacity: 0;animation: 3s bannerRunI9 ease 8s infinite;-webkit-animation: 3s bannerRunI9 ease 8s infinite;-moz-animation: 5s bannerRunI9 ease infinite;-o-animation: 5s bannerRunI9 ease infinite;}*/
             @keyframes bannerRunI1 {
               0%{bottom: 150px;opacity: 1;}
               100%{bottom: 240px;opacity: 0;left: 70px;}
@@ -85,12 +81,12 @@
             @keyframes bannerRunI2 {
               //0%{opacity: 0.5;}
               0%{opacity: 0;}
-              5%{bottom: 240px;opacity: 0.6;}
+              5%{bottom: 240px;opacity: 0.7;}
               100%{bottom: 410px;opacity: 0;left: 40px;}
             }
             @keyframes bannerRunI3 {
               0%{opacity: 0;}
-              5%{bottom: 220px;opacity: 0.7;}
+              5%{bottom: 220px;opacity: 0.8;}
               100%{bottom: 380px;opacity: 0;left: 130px}
             }
             @keyframes bannerRunI4 {
@@ -100,29 +96,9 @@
             }
             @keyframes bannerRunI5 {
               0%{opacity: 0;}
-              5%{bottom: 310px;opacity: 0.5;}
+              5%{bottom: 310px;opacity: 0.6;}
               100%{bottom: 420px;opacity: 0;left: 110px}
             }
-           /* @keyframes bannerRunI6 {
-              0%{opacity: 0;}
-              5%{top: 150px;opacity: 0.5;}
-              100%{top: 30px;opacity: 0;}
-            }
-            @keyframes bannerRunI7 {
-              0%{opacity: 0;}
-              5%{top: 110px;opacity: 0.5;}
-              100%{top: 0;opacity: 0;}
-            }
-            @keyframes bannerRunI8 {
-              0%{opacity: 0;}
-              5%{top: 80px;opacity: 0.5;}
-              100%{top: 0;opacity: 0;}
-            }
-            @keyframes bannerRunI9 {
-              0%{opacity: 0;}
-              5%{top: 50px;opacity: 0.5;}
-              100%{top: 0;opacity: 0;}
-            }*/
       }
     }
 

+ 0 - 4
src/views/client/Index.vue

@@ -40,10 +40,6 @@
                         <i></i>
                         <i></i>
                         <i></i>
-                     <!--   <i></i>
-                        <i></i>
-                        <i></i>
-                        <i></i>-->
                     </div>
                 </div>
             </div>