up

home/index.html.erb

@@ -7,12 +7,13 @@
   <%= render_orbit_bar %>
   <div class="background" data-pp="100"></div>
   <%= render_header %>
-  <div class="no-print single-child-datapp homebanner " data-pp="999"></div>
-  <div class="layout-slide no-print single-child-datapp homebanner" data-pp="300"></div>
-  <div class="layout-content2 topcontent">
-    <div class=" single-child-datapp onesection" id="onesection" data-pp="1999"></div>
-  </div>
+
   <div class="verticalhome-wrapper">
+    <div class="no-print single-child-datapp homebanner " data-pp="999"></div>
+    <div class="layout-slide no-print single-child-datapp homebanner" data-pp="300"></div>
+    <div class="layout-content2 topcontent">
+      <div class=" single-child-datapp onesection" id="onesection" data-pp="1999"></div>
+    </div>
     <div class="verticalhome">
       <div class="layout-content topcontent">
         <a id="accesskey_content" accesskey="C" href="/<%= "#{locale.to_s}" %>/accesskey" title="Content">:::</a>

home/page.html.erb

@@ -7,14 +7,15 @@
   <%= render_orbit_bar %>
   <div class="background" data-pp="100"></div>
   <%= render_header %>
-  <div class="no-print single-child-datapp homebanner " data-pp="998"></div>
-  <section class="layout-slide no-print single-child-datapp homebanner" data-pp="300"></section>
+
   <!-- <div class="contentwrap">
     <div class="container ">
         <div class="extra-box col-sm-12" data-pp="388"></div>
     </div>
   </div> -->
   <div class="verticalhome-wrapper">
+    <div class="no-print single-child-datapp homebanner " data-pp="998"></div>
+  <section class="layout-slide no-print single-child-datapp homebanner" data-pp="300"></section>
   <div class="verticalhome">
     <div class="layout-content">
       <div class="layout-content-inner inner-page contentwrap3">

modules/ad_banner/_ad_banner_widget0.html.erb

@@ -63,7 +63,62 @@
   $('[data-subpart-id="{{subpart-id}}"] .prev-button').click(function(){
     $(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle("prev");
   });
- 
+  $(function() {
+    function updateBannerClip() {
+      $('.ba-banner-widget-0').each(function() {
+        var $banner = $(this);
+        var vpWidth  = $(window).width();
+        var vpHeight = $(window).height();
+
+        // --- 寬度：找比 viewport 窄的父層容器 ---
+        var $container = null;
+        $banner.parents().each(function() {
+          var $el = $(this);
+          if ($el.outerWidth() < vpWidth - 10) {
+            $container = $el;
+            return false;
+          }
+        });
+
+        var clipLeft   = 0;
+        var clipRight  = 0;
+        if ($container && $container.length > 0) {
+          clipLeft  = Math.max(0, $container.offset().left);
+          clipRight = Math.max(0, vpWidth - $container.offset().left - $container.outerWidth());
+        }
+
+        // --- 高度：依 .w-ad-banner 自己區塊的上下邊界裁切 ---
+        var bannerTop    = $banner.offset().top - $(window).scrollTop();
+        var bannerBottom = vpHeight - bannerTop - $banner.outerHeight();
+
+        var clipTop    = Math.max(0, bannerTop);
+        var clipBottom = Math.max(0, bannerBottom);
+
+        var clipValue = 'inset('
+          + clipTop    + 'px '
+          + clipRight  + 'px '
+          + clipBottom + 'px '
+          + clipLeft   + 'px)';
+
+        $banner.find('img.w-ba-banner__image').css('clip-path', clipValue);
+      });
+    }
+
+    // 初始執行
+    setTimeout(updateBannerClip, 300);
+
+    // 視窗縮放時重新計算
+    var resizeTimer;
+    $(window).on('resize', function() {
+      clearTimeout(resizeTimer);
+      resizeTimer = setTimeout(updateBannerClip, 100);
+    });
+
+    // ✅ 滾動時也要更新，因為 bannerTop 會隨捲動改變
+    $(window).on('scroll', function() {
+      updateBannerClip();
+    });
+  });
 </script>
 <style type="text/css">
   .w-ba-banner .controlplay .pause-slide.active i{