瀏覽代碼

style: 合作伙伴轮播增加两侧模糊

cuiyalong 1 月之前
父節點
當前提交
c7bef88e99
共有 1 個文件被更改,包括 21 次插入0 次删除
  1. 21 0
      src/web/templates/product-introduce/template/partners-swipe.html

+ 21 - 0
src/web/templates/product-introduce/template/partners-swipe.html

@@ -1,6 +1,7 @@
 <!-- 合作伙伴 -->
 <style>
 .jy-index-partners{
+  position: relative;
   width: 100%;
   padding: 60px 0;
   background: #FFF;
@@ -34,9 +35,29 @@
   transition: ease 0.3s;
   position: relative;
 }
+.partners-shadow-left{
+  width: 200px;
+  height: 312px;
+  background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 47.87%, #FFFFFF 100%);
+  position: absolute;
+  left: 0;
+  top: 0;
+  z-index: 10;
+}
+.partners-shadow-right{
+  width: 200px;
+  height: 312px;
+  background: linear-gradient(270deg, #FFFFFF 0%, #FFFFFF 52.13%, rgba(255, 255, 255, 0) 100%);
+  position: absolute;
+  right: 0;
+  top: 0;
+  z-index: 10;
+}
 </style>
 <div class="jy-index-partners CfadeInUp">
   <div class="partners-container swiper-container">
+    <div class="partners-shadow-left"></div>
+    <div class="partners-shadow-right"></div>
     <div class="swiper-wrapper">
       <div class="swiper-slide">
         <div class="img-box">