修改H5信息平台广告轮播图大小

src/main/resources/static/css/article/drawer-footer.css

@@ -92,7 +92,6 @@
     vertical-align: top;
     width: 45.6vw;
     height: 100%;
-    background: #fff;
 }
 .advertisement .advertisement-link img {
     width: 100%;

src/main/resources/static/js/article/common.js

@@ -106,6 +106,8 @@ const drawerFooter = new Vue({
         recommend: [],
         typeId: 0,
         labelId: 0,
+        screenWidth: 0,
+        vantWidth: 0 // 轮播图width
     },
     mounted() {
         this.typeId = $("#typeId").val() * 1;
@@ -125,6 +127,19 @@ const drawerFooter = new Vue({
                 console.log(res);
             });
         }
+        this.screenWidth = document.body.clientWidth
+        window.onresize = () => {
+            return (() => {
+                this.screenWidth = document.body.clientWidth
+            })()
+        }
+    },
+    watch: {
+        screenWidth: {
+            handler (val) {
+                this.vantWidth = val * 48 / 100
+            }
+        },
     },
     methods: {
         //    链接跳转

src/main/resources/templates/article/components/article-drawer.html

@@ -74,9 +74,9 @@
   </div>
   <!--    广告-->
   <div class="advertisement" th:if="${#arrays.length(ads)} > 0 and ${isSelectInfo}">
-    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
-      <van-swipe-item class="advertisement-link" th:each="ad : ${ads}">
-        <a th:href="${ad.link}" target="_blank">
+    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white" :loop="false" :width="vantWidth">
+      <van-swipe-item th:each="ad : ${ads}">
+        <a class="advertisement-link" th:href="${ad.link}" target="_blank">
           <img th:src="${ad.image}" th:alt="${ad.title}" class="advertisement-img" th:onclick="handleAdvHits([[${ad}]])"/>
         </a>
       </van-swipe-item>