fixbug

dist/css/index.css

@@ -268,8 +268,8 @@ header > ul li a {
 }
 header > ul li.active a {
   color: #1dd2af;
-  border-bottom: 5px solid #1dd2af;
-  padding-bottom: 21px;
+  border-bottom: 6px solid #1dd2af;
+  padding-bottom: 22px;
 }
 header > .loginWord {
   display: inline-block;
@@ -595,7 +595,7 @@ th {
 .slideImg {
   margin: 0 auto;
   width: 1200px;
-  height: 556px;
+  height: 600px;
   overflow: hidden;
 }
 .comIndex {
@@ -837,7 +837,7 @@ th {
 }
 .case > ul li div {
   width: 100%;
-  height: 280px;
+  height: 267px;
   overflow: hidden;
   margin-bottom: 15px;
   opacity: 0.7;
@@ -852,7 +852,7 @@ th {
   font-size: 16px;
   color: #999;
   padding: 0 20px;
-  line-height: 30px;
+  line-height: 37px;
   text-align: left;
   /*  display: -webkit-box;*/
   overflow: hidden;
@@ -894,7 +894,7 @@ th {
 }
 .case > ul li.active h3 {
   color: #fff;
-  line-height: 25px;
+  line-height: 30px;
 }
 .case > ul li.active p {
   color: #8899a8;
@@ -1019,14 +1019,14 @@ th {
 article.case {
   margin: 0 auto;
   width: 1200px;
-  height: 880px;
+  height: 900px;
   overflow: hidden;
   background: #fff;
-  padding: 100px 140px 30px 140px;
+  padding: 60px 140px 30px 140px;
 }
 article.case section ul.lists li {
   width: 294px;
-  height: 215px;
+  height: 245px;
   float: left;
   margin: 0px 15px 20px 0px;
   overflow: hidden;
@@ -1043,7 +1043,7 @@ article.case section ul.lists li a {
 }
 article.case section ul.lists li a .picture {
   width: 294px;
-  height: 215px;
+  height: 245px;
   overflow: hidden;
   position: relative;
   border-radius: 4px;
@@ -1057,7 +1057,7 @@ article.case section ul.lists li a .picture img {
 }
 article.case section ul.lists li a .mask {
   width: 294px;
-  height: 215px;
+  height: 245px;
   background: none;
   opacity: 1;
   border-radius: 4px;
@@ -1067,7 +1067,7 @@ article.case section ul.lists li a .mask {
 }
 article.case section ul.lists li a .mask span {
   display: block;
-  margin: 26% auto;
+  margin: 35% auto;
 }
 article.case section ul.lists li a .mask span h4 {
   line-height: 28px;
@@ -1205,7 +1205,7 @@ article.case section:after {
 .caseTitle .caseContent div ul li div.img {
   margin: 0 auto;
   width: 820px;
-  height: 558px;
+  height: 547px;
   overflow: hidden;
   position: relative;
   padding: 15px;
@@ -1268,13 +1268,13 @@ article.case section:after {
 }
 .gallery .coverSlide {
   margin: 0 auto;
-  width: 935px;
-  height: 444px;
+  width: 940px;
+  height: 470px;
   overflow: hidden;
 }
 .gallery .coverSlide p {
   font-size: 44px;
-  top: 28%;
+  top: 29%;
 }
 .gallery .search {
   width: 100%;
@@ -1327,7 +1327,7 @@ article.case section:after {
 }
 .gallery .searchContent ul.lists li {
   width: 294px;
-  height: 215px;
+  height: 202px;
   float: left;
   margin: 0px 15px 20px 0px;
   overflow: hidden;
@@ -1344,7 +1344,7 @@ article.case section:after {
 }
 .gallery .searchContent ul.lists li a .picture {
   width: 294px;
-  height: 215px;
+  height: 202px;
   overflow: hidden;
   position: relative;
   border-radius: 4px;
@@ -1358,7 +1358,7 @@ article.case section:after {
 }
 .gallery .searchContent ul.lists li a .mask {
   width: 304px;
-  height: 215px;
+  height: 202px;
   background: #37404c;
   opacity: 0.6;
   border-radius: 4px;
@@ -1413,9 +1413,11 @@ article.case section:after {
 }
 .gallery .searchContent ul.lists li {
   width: 304px;
+  height: 202px;
 }
 .gallery .searchContent ul.lists li a .picture {
   width: 304px;
+  height: 202px;
 }
 .gallery .searchContent ul.lists li a .mask span {
   display: block;
@@ -1523,7 +1525,7 @@ article.case section:after {
 .activeDetails .coverShow .coverImg {
   margin: 0 auto;
   width: 984px;
-  height: 348px;
+  height: 492px;
   overflow: hidden;
   position: relative;
 }
@@ -1544,8 +1546,7 @@ article.case section:after {
 }
 .activeDetails .coverShow .intro ul {
   display: block;
-  padding: 0px 160px 20px 160px;
-  text-align: center;
+  padding: 0px 100px 0px 100px;
 }
 .activeDetails .coverShow .intro ul:before,
 .activeDetails .coverShow .intro ul:after {
@@ -1557,9 +1558,15 @@ article.case section:after {
 }
 .activeDetails .coverShow .intro ul li {
   float: left;
-  padding: 0 20px;
+  /* min-width: 33%;*/
   color: #999;
   font-size: 16px;
+  margin-bottom: 20px;
+  text-align: center;
+  padding: 0 20px;
+  /*          &:nth-child(3){
+            float: right;
+          }*/
 }
 .activeDetails .coverShow .intro ul li > i {
   display: inline-block;
@@ -1603,7 +1610,7 @@ article.case section:after {
 }
 .activeDetails .activeContent ul.lists li {
   width: 294px;
-  height: 215px;
+  height: 202px;
   float: left;
   margin: 0px 15px 20px 0px;
   overflow: hidden;
@@ -1620,7 +1627,7 @@ article.case section:after {
 }
 .activeDetails .activeContent ul.lists li a .picture {
   width: 294px;
-  height: 215px;
+  height: 202px;
   overflow: hidden;
   position: relative;
   border-radius: 4px;
@@ -1634,7 +1641,7 @@ article.case section:after {
 }
 .activeDetails .activeContent ul.lists li a .mask {
   width: 304px;
-  height: 215px;
+  height: 202px;
   background: #37404c;
   opacity: 0.6;
   border-radius: 4px;
@@ -1739,18 +1746,16 @@ article.case section:after {
 .activity .title .bannerBg {
   margin: 0 auto;
   width: 1200px;
-  height: 565px;
+  height: 600px;
   overflow: hidden;
   position: relative;
   background: #ccc;
   /*      margin-bottom: 30px;*/
 }
 .activity .title .bannerBg .bgImg {
-  position: absolute;
-  z-index: -1;
   margin: 0 auto;
   width: 1200px;
-  height: 565px;
+  height: 600px;
   overflow: hidden;
 }
 .activity .title .bannerBg .bgImg img {
@@ -1759,7 +1764,16 @@ article.case section:after {
   -o-object-fit: cover;
   object-fit: cover;
 }
+.activity .title .bannerBg .bgImg .maskBg {
+  position: absolute;
+  top: 0px;
+  left: 0px;
+}
 .activity .title .bannerBg .logo {
+  position: absolute;
+  top: 0px;
+  left: 44%;
+  z-index: 2;
   margin: 0 auto;
   width: 140px;
   height: 140px;
@@ -1767,7 +1781,7 @@ article.case section:after {
   border-radius: 50%;
   background: #dddddd;
   border: 4px solid #FFFFFF;
-  margin-top: 12%;
+  margin-top: 14%;
 }
 .activity .title .bannerBg .logo img {
   width: 100%;
@@ -1780,6 +1794,9 @@ article.case section:after {
   text-align: center;
   line-height: 80px;
   color: #FFFFFF;
+  position: relative;
+  top: -240px;
+  z-index: 3;
 }
 .activity .title .tabs {
   height: 120px;
@@ -1856,8 +1873,8 @@ article.case section:after {
 }
 .activity .activeSlide ul li .activeCarousel ul li div {
   margin: 0 auto;
-  width: 225px;
-  height: 120px;
+  width: 160px;
+  height: 125px;
   overflow: hidden;
 }
 .activity .activeSlide ul li .activeCarousel ul li h3 {
@@ -1869,8 +1886,10 @@ article.case section:after {
   font-size: 12px;
   text-align: left;
   padding: 0 10px;
-  line-height: 17px;
-  height: 20px;
+  line-height: 36px;
+}
+.activity .activeSlide ul li .activeCarousel ul li.active p {
+  line-height: 28px;
 }
 .activity .space {
   text-align: center;

dist/css/jcarousellite.css

@@ -268,8 +268,8 @@ header > ul li a {
 }
 header > ul li.active a {
   color: #1dd2af;
-  border-bottom: 5px solid #1dd2af;
-  padding-bottom: 21px;
+  border-bottom: 6px solid #1dd2af;
+  padding-bottom: 22px;
 }
 header > .loginWord {
   display: inline-block;
@@ -602,14 +602,14 @@ th {
 /* Styling for image based carousel content. Only width and height are mandatory */
 .cooperation .carousel > ul > li {
   width: 160px !important;
-  height: 171px !important;
-  line-height: 171px !important;
+  height: 160px !important;
+  line-height: 160px !important;
   text-align: center;
-  margin: 50px 20px;
+  margin: 55px 20px;
 }
 .cooperation .carousel > ul > li > img {
   width: 100%;
-  height: auto;
+  height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
   vertical-align: middle;

dist/css/largeSlides.css

@@ -268,8 +268,8 @@ header > ul li a {
 }
 header > ul li.active a {
   color: #1dd2af;
-  border-bottom: 5px solid #1dd2af;
-  padding-bottom: 21px;
+  border-bottom: 6px solid #1dd2af;
+  padding-bottom: 22px;
 }
 header > .loginWord {
   display: inline-block;
@@ -677,7 +677,7 @@ h3 {
 .callbacks li {
   position: absolute;
   width: 100%;
-  height: 555px;
+  height: 600px;
   left: 0;
   top: 0;
 }
@@ -685,9 +685,10 @@ h3 {
   display: block;
   position: relative;
   z-index: 1;
-  height: 555px;
+  height: 100%;
   width: 100%;
   border: 0;
+  overflow: hidden;
 }
 .callbacks img.maskBg {
   position: absolute;
@@ -702,7 +703,7 @@ h3 {
   font-size: 60px;
   text-shadow: none;
   color: #fff;
-  top: 35%;
+  top: 38%;
   padding: 10px 20px;
   margin: 0;
   max-width: none;
@@ -710,7 +711,7 @@ h3 {
 }
 .callbacks_nav {
   position: absolute;
-  top: 49%;
+  top: 50.5%;
   left: 38px;
   opacity: 0.7;
   z-index: 3;
@@ -767,6 +768,6 @@ li.callbacks_here {
     font: 24px/50px "Helvetica Neue", Helvetica, Arial, sans-serif;
   }
   .callbacks_nav {
-    top: 47%;
+    top: 51%;
   }
 }

dist/html/gal_activityDetails.html

@@ -59,9 +59,9 @@
                 <li>
                     <i class="client"></i><span>客户：可以文化</span>
                 </li>
-                <li>
+<!--                <li>
                     <i class="view"></i><span>浏览量：235632</span>
-                </li>
+                </li>-->
             </ul>
             <p>
                 活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介

dist/html/index.html

@@ -220,7 +220,7 @@
                            <p>企视录影像</p>
                        </a>
                    </li>
-        <li>
+        <!--       <li>
                      <a href="">
                          <div>
                              <img src="../img/case_img.png" alt=""/>
@@ -228,7 +228,7 @@
                          <h3>维多利亚</h3>
                          <p>企视录影像</p>
                      </a>
-        </li>
+                 </li>-->
     </ul>
 </section>
 <!--影像服务-->
@@ -250,23 +250,23 @@
 <!--合作商家-->
 <section class="cooperation">
     <div class="custom-container mouseWheelButtons">
-        <a href="#" class="prev"></a>
+        <a href="#" class="prev prevBtn"></a>
         <div class="carousel">
             <ul>
                 <li><img src="../img/text1.png"></li>
                <li><img src="../img/text2.png"></li>
                               <li><img src="../img/text3.png"></li>
-                <li><img src="../img/text4.png"></li>
+                <!--                       <li><img src="../img/text4.png"></li>
                                 <li><img src="../img/text5.png"></li>
                            <li><img src="../img/text3.png"></li>
                             <li><img src="../img/text4.png"></li>
                             <li><img src="../img/text2.png"></li>
                             <li><img src="../img/text5.png"></li>
                             <li><img src="../img/text1.png"></li>
-                <li><img src="../img/text3.png"></li>
+                            <li><img src="../img/text3.png"></li>-->
             </ul>
         </div>
-        <a href="#" class="next"></a>
+        <a href="#" class="next nextBtn"></a>
         <div class="clear"></div>
     </div>
 </section>
@@ -302,18 +302,6 @@
         });
     });
 </script>
-<!--五张图轮播效果-->
-<script type="text/javascript">
-    $(".mouseWheelButtons .carousel").jCarouselLite({
-        btnNext: ".mouseWheelButtons .next",
-        btnPrev: ".mouseWheelButtons .prev",
-        mouseWheel: true,
-        circular: true,
-        speed: 1000,
-        visible: 5,
-        scroll: 5
-    });
-</script>
 
 <!--模态框配置-->
 <script>
@@ -332,11 +320,63 @@
 </script>
 <script>
     /*案例模块放大效果*/
-    $(".case ul li").mouseenter(function(){
+    window.onload = function() {
+        var lis = $(".case ul li");
+        var l=lis.size();
+        if(l==1){
+            lis.css("margin-left",37+'%');
+            lis.mouseenter(function () {
+                $(this).addClass("active").siblings().removeClass();
+            }).mouseleave(function () {
+                $(this).removeClass("active");
+            })
+        }else if(l==2){
+            lis.css("margin-left",13.5+'%');
+            lis.mouseenter(function () {
                 $(this).addClass("active").siblings().removeClass();
-    }).mouseleave(function(){
-        $("#largeShow").addClass("active").siblings().removeClass();
+            }).mouseleave(function () {
+                $(this).addClass("active");
             })
+        }else if(l==3){
+            lis.mouseenter(function () {
+                $(this).addClass("active").siblings().removeClass();
+            }).mouseleave(function () {
+                $(this).removeClass("active");
+                lis.eq(1).addClass("active").siblings().removeClass();
+            })
+        }
+     <!--五张图轮播效果-->
+        var carousel=$(".carousel");
+        var len = $(".carousel ul li").size();
+        if(len<=5){
+            $(".prevBtn").css("display","none");
+            $(".nextBtn").css("display","none");
+            $(".mouseWheelButtons .carousel").jCarouselLite({
+                circular: false,
+                visible:len
+            });
+            if(len==1){
+                carousel.css("margin-left",39+'%');
+            }else if(len==2){
+                carousel.css("margin-left",29+'%');
+            }else if(len==3){
+                carousel.css("margin-left",19+'%');
+            }else if(len==4){
+                carousel.css("margin-left",9+'%');
+            }
+        }else{
+            $(".mouseWheelButtons .carousel").jCarouselLite({
+                btnNext: ".mouseWheelButtons .next",
+                btnPrev: ".mouseWheelButtons .prev",
+                mouseWheel: true,
+                circular: true,
+                speed: 1000,
+                visible: 5,
+                scroll: 5
+            });
+        }
+
+    }
 
     /*表单提交验证*/
     var org_people= /^[\u4E00-\uFA29a-zA-Z ]{1,12}$/; //验证昵称 英文、汉字共1-12位;

src/less/common/header_footer.less

@@ -7,9 +7,6 @@ header{
     .margin-auto(117px,49px);
     margin:26px 51px auto 74px;
     float: left;
-    >img{
-
-    }
   }
   >ul li{
     float: left;
@@ -29,8 +26,8 @@ header{
     &.active{
       a{
         color:#1dd2af;
-        border-bottom:5px solid #1dd2af;
-        padding-bottom:21px;
+        border-bottom:6px solid #1dd2af;
+        padding-bottom:22px;
       }
     }
   }

src/less/common/maskLists.less

@@ -4,7 +4,7 @@
 .maskLists(){
   ul.lists li{
     width: 294px;
-    height: 215px;
+    height: 202px;
     float: left;
     margin: 0px 15px 20px 0px;
     overflow: hidden;
@@ -19,7 +19,7 @@
       position: relative;
       .picture{
         width: 294px;
-        height: 215px;
+        height: 202px;
         overflow: hidden;
         position: relative;
         border-radius: 4px;
@@ -32,7 +32,7 @@
         }
       }
       .mask{
-        .mask(304px,215px,#37404c,0.6,4px);
+        .mask(304px,202px,#37404c,0.6,4px);
         span{
           display: block;
           margin: 41% auto;

src/less/index.less

@@ -2,7 +2,7 @@
 @import "./common/base.less";
 /*轮播图模块*/
 .slideImg{
-  .margin-auto(1200px,556px);
+  .margin-auto(1200px,600px);
   overflow: hidden;
 }
 
@@ -189,7 +189,7 @@
     background: #f6f6f6;
     div{
       width:100%;
-      height: 280px;
+      height: 267px;
       overflow: hidden;
       margin-bottom: 15px;
       opacity: 0.7;
@@ -204,7 +204,7 @@
       font-size:16px;
       color: #999;
       padding:0 20px;
-      line-height: 30px;
+      line-height: 37px;
       text-align: left;
       .ellipsis(1);
       font-weight:500;
@@ -230,7 +230,7 @@
       }
       h3{
         color: #fff;
-        line-height: 25px;
+        line-height: 30px;
       }
       p{
         color: #8899a8;
@@ -335,14 +335,14 @@ input[type='button']{
 article.case {
   margin: 0 auto;
   width: 1200px;
-  height: 880px;
+  height: 900px;
   overflow: hidden;
   background: #fff;
-  padding: 100px 140px 30px 140px;
+  padding: 60px 140px 30px 140px;
   section{
     ul.lists li{
       width: 294px;
-      height: 215px;
+      height: 245px;
       float: left;
       margin: 0px 15px 20px 0px;
       overflow: hidden;
@@ -357,7 +357,7 @@ article.case {
         position: relative;
         .picture{
           width: 294px;
-          height: 215px;
+          height: 245px;
           overflow: hidden;
           position: relative;
           border-radius: 4px;
@@ -370,11 +370,11 @@ article.case {
           }
         }
         .mask{
-          .mask(294px,215px,none,1,4px);
+          .mask(294px,245px,none,1,4px);
           top:0px;
           span{
             display: block;
-            margin: 26% auto;
+            margin: 35% auto;
             h4{
               line-height:28px;
               text-align: center;
@@ -498,7 +498,7 @@ article.case {
           margin: 70px auto 30px auto;
         }
         div.img{
-          .margin-auto(820px,558px);
+          .margin-auto(820px,547px);
           position: relative;
           padding: 15px;
           border:1px solid #CCCCCC;
@@ -545,10 +545,10 @@ article.case {
   background: #fff;
   padding: 80px 128px 0px 128px;
   .coverSlide{
-    .margin-auto(935px,444px);
+    .margin-auto(940px,470px);
     p{
       font-size: 44px;
-      top: 28%;
+      top: 29%;
     }
   }
   .search{
@@ -591,8 +591,10 @@ article.case {
     .maskLists();
      ul.lists li{
       width: 304px;
+       height: 202px;
       a .picture{
         width: 304px;
+        height: 202px;
       }
        a .mask span {
          display: block;
@@ -689,7 +691,7 @@ article.case {
     background: #f4f4f4;
     padding-bottom: 30px;
    .coverImg{
-     .margin-auto(984px,348px);
+     .margin-auto(984px,492px);
      position: relative;
      img{
        .img_middle();
@@ -704,13 +706,15 @@ article.case {
       ul{
         display: block;
         .clearfix();
-        padding: 0px 160px 20px 160px;
-        text-align: center;
+        padding: 0px 100px 0px 100px;
         li{
           float: left;
-          padding: 0 20px;
+         /* min-width: 33%;*/
           color: #999;
           font-size: 16px;
+          margin-bottom: 20px;
+          text-align: center;
+          padding: 0 20px;
           >i{
             display: inline-block;
             width: 20px;
@@ -731,6 +735,9 @@ article.case {
           .view{
             .sprite(@view);
           }
+/*          &:nth-child(3){
+            float: right;
+          }*/
         }
       }
       p{
@@ -786,28 +793,34 @@ article.case {
   text-align: center;
   .title{
     .bannerBg{
-      .margin-auto(1200px,565px);
+      .margin-auto(1200px,600px);
       position: relative;
       background: #ccc;
 /*      margin-bottom: 30px;*/
       .bgImg{
-        position: absolute;
-        z-index: -1;
-        .margin-auto(1200px,565px);
+        .margin-auto(1200px,600px);
         img{
           width: 100%;
           height: 100%;
           -o-object-fit: cover;
           object-fit: cover;
         }
+        .maskBg{
+          position: absolute;
+          top: 0px;
+          left: 0px;
+        }
       }
       .logo{
-
+        position: absolute;
+        top:0px;
+        left: 44%;
+        z-index:2;
         .margin-auto(140px,140px);
         border-radius: 50%;
         background: #dddddd;
         border: 4px solid #FFFFFF;
-        margin-top:12%;
+        margin-top:14%;
         img{
           width: 100%;
           height: 100%;
@@ -820,6 +833,9 @@ article.case {
         text-align: center;
         line-height: 80px;
         color: #FFFFFF;
+        position: relative;
+        top: -240px;
+        z-index: 3;
       }
     }
     .tabs{
@@ -880,7 +896,7 @@ article.case {
         top:3px;
         ul li{
           div{
-            .margin-auto(225px,120px);
+            .margin-auto(160px,125px);
           }
           h3{
             font-size: 14px;
@@ -891,8 +907,12 @@ article.case {
             font-size: 12px;
             text-align: left;
             padding: 0 10px;
-            line-height: 17px;
-            height: 20px;
+            line-height: 36px;
+          }
+          &.active{
+            p{
+              line-height: 28px;
+            }
           }
         }
       }

src/less/jcarousellite.less

@@ -14,14 +14,14 @@
     /* Styling for image based carousel content. Only width and height are mandatory */
 .cooperation .carousel>ul>li {
     width: 160px !important;
-    height: 171px !important;
-    line-height: 171px !important;
+    height: 160px !important;
+    line-height: 160px !important;
     text-align: center;
-    margin: 50px 20px;
+    margin: 55px 20px;
 }
     .cooperation .carousel>ul>li>img {
         width: 100%;
-        height: auto;
+        height: 100%;
         -o-object-fit: cover;
         object-fit: cover;
         vertical-align:middle;

src/less/largeSlides.less

@@ -101,7 +101,7 @@ h3 {
 .callbacks li {
   position: absolute;
   width: 100%;
-  height: 555px;
+  height:600px;
   left: 0;
   top: 0;
   }
@@ -110,9 +110,10 @@ h3 {
   display: block;
   position: relative;
   z-index: 1;
-  height: 555px;
+  height:100%;
   width: 100%;
   border: 0;
+  overflow: hidden;
   }
 .callbacks img.maskBg{
   position: absolute;
@@ -127,7 +128,7 @@ h3 {
   font-size: 60px;
   text-shadow: none;
   color: #fff;
-  top:35%;
+  top:38%;
   padding: 10px 20px;
   margin: 0;
   max-width: none;
@@ -136,7 +137,7 @@ h3 {
 
 .callbacks_nav {
   position: absolute;
-  top:49%;
+  top:50.5%;
   left:38px;
   opacity: 0.7;
   z-index: 3;
@@ -191,6 +192,6 @@ li.callbacks_here{
     font: 24px/50px "Helvetica Neue", Helvetica, Arial, sans-serif;
     }
   .callbacks_nav {
-    top: 47%;
+    top: 51%;
     }
   }

src/pages/gal_activityDetails.ejs

@@ -35,9 +35,9 @@
                 <li>
                     <i class="client"></i><span>客户：可以文化</span>
                 </li>
-                <li>
+<!--                <li>
                     <i class="view"></i><span>浏览量：235632</span>
-                </li>
+                </li>-->
             </ul>
             <p>
                 活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介活动简介

src/pages/index.ejs

@@ -196,7 +196,7 @@
                            <p>企视录影像</p>
                        </a>
                    </li>
-        <li>
+        <!--       <li>
                      <a href="">
                          <div>
                              <img src="../img/case_img.png" alt=""/>
@@ -204,7 +204,7 @@
                          <h3>维多利亚</h3>
                          <p>企视录影像</p>
                      </a>
-        </li>
+                 </li>-->
     </ul>
 </section>
 <!--影像服务-->
@@ -226,23 +226,23 @@
 <!--合作商家-->
 <section class="cooperation">
     <div class="custom-container mouseWheelButtons">
-        <a href="#" class="prev"></a>
+        <a href="#" class="prev prevBtn"></a>
         <div class="carousel">
             <ul>
                 <li><img src="../img/text1.png"></li>
                <li><img src="../img/text2.png"></li>
                               <li><img src="../img/text3.png"></li>
-                <li><img src="../img/text4.png"></li>
+                <!--                       <li><img src="../img/text4.png"></li>
                                 <li><img src="../img/text5.png"></li>
                            <li><img src="../img/text3.png"></li>
                             <li><img src="../img/text4.png"></li>
                             <li><img src="../img/text2.png"></li>
                             <li><img src="../img/text5.png"></li>
                             <li><img src="../img/text1.png"></li>
-                <li><img src="../img/text3.png"></li>
+                            <li><img src="../img/text3.png"></li>-->
             </ul>
         </div>
-        <a href="#" class="next"></a>
+        <a href="#" class="next nextBtn"></a>
         <div class="clear"></div>
     </div>
 </section>
@@ -270,18 +270,6 @@
         });
     });
 </script>
-<!--五张图轮播效果-->
-<script type="text/javascript">
-    $(".mouseWheelButtons .carousel").jCarouselLite({
-        btnNext: ".mouseWheelButtons .next",
-        btnPrev: ".mouseWheelButtons .prev",
-        mouseWheel: true,
-        circular: true,
-        speed: 1000,
-        visible: 5,
-        scroll: 5
-    });
-</script>
 
 <!--模态框配置-->
 <script>
@@ -300,11 +288,63 @@
 </script>
 <script>
     /*案例模块放大效果*/
-    $(".case ul li").mouseenter(function(){
+    window.onload = function() {
+        var lis = $(".case ul li");
+        var l=lis.size();
+        if(l==1){
+            lis.css("margin-left",37+'%');
+            lis.mouseenter(function () {
+                $(this).addClass("active").siblings().removeClass();
+            }).mouseleave(function () {
+                $(this).removeClass("active");
+            })
+        }else if(l==2){
+            lis.css("margin-left",13.5+'%');
+            lis.mouseenter(function () {
+                $(this).addClass("active").siblings().removeClass();
+            }).mouseleave(function () {
+                $(this).addClass("active");
+            })
+        }else if(l==3){
+            lis.mouseenter(function () {
                 $(this).addClass("active").siblings().removeClass();
-    }).mouseleave(function(){
-        $("#largeShow").addClass("active").siblings().removeClass();
+            }).mouseleave(function () {
+                $(this).removeClass("active");
+                lis.eq(1).addClass("active").siblings().removeClass();
             })
+        }
+     <!--五张图轮播效果-->
+        var carousel=$(".carousel");
+        var len = $(".carousel ul li").size();
+        if(len<=5){
+            $(".prevBtn").css("display","none");
+            $(".nextBtn").css("display","none");
+            $(".mouseWheelButtons .carousel").jCarouselLite({
+                circular: false,
+                visible:len
+            });
+            if(len==1){
+                carousel.css("margin-left",39+'%');
+            }else if(len==2){
+                carousel.css("margin-left",29+'%');
+            }else if(len==3){
+                carousel.css("margin-left",19+'%');
+            }else if(len==4){
+                carousel.css("margin-left",9+'%');
+            }
+        }else{
+            $(".mouseWheelButtons .carousel").jCarouselLite({
+                btnNext: ".mouseWheelButtons .next",
+                btnPrev: ".mouseWheelButtons .prev",
+                mouseWheel: true,
+                circular: true,
+                speed: 1000,
+                visible: 5,
+                scroll: 5
+            });
+        }
+
+    }
 
     /*表单提交验证*/
     var org_people= /^[\u4E00-\uFA29a-zA-Z ]{1,12}$/; //验证昵称 英文、汉字共1-12位;