update

2026-09-09 23:05:59 +08:00 · 2026-09-09 23:05:59 +08:00 · b719a7ca55
parent 2ff1f70480
commit b719a7ca55
4 changed files with 141 additions and 40 deletions
--- a/assets/javascripts/app.js
+++ b/assets/javascripts/app.js
@ -2074,27 +2074,28 @@ $(function() {
  });
  //rucaptcha-image
  $(document).ready(function () {
-      $('.rucaptcha-image').removeAttr('onload');
-    
-      // 檢查是否已插入過
-      if (!$('#captcha_audio').length) {
-        const audioButton = $(`
-          <button 
-            title="播放驗證碼語音" 
-            type="button" 
-            onclick="document.getElementById('captcha_audio').play();" 
-            class="fas fa-volume-up" 
-            aria-label="播放驗證碼語音"
-            role="button"
-            style="font-size: 1.5em; color: #333; cursor: pointer; border: 2px solid #333; padding: 0.2em;">
-            <span class="sr-only">播放驗證碼語音</span>
-          </button>
-        `);
-    
-        const audio = $('<audio id="captcha_audio" src="/rucaptcha/?format=wav&amp;locale=zh_tw"></audio>');
-    
-        $('.rucaptcha-image').after(audioButton, audio);
+      // >>> 修正：先確認頁面上真的有驗證碼圖片，再往下執行，避免沒有驗證碼的頁面也發出多餘的 wav 請求
+      if ($('.rucaptcha-image').length) {
+        $('.rucaptcha-image').removeAttr('onload');
+        // 檢查是否已插入過
+        if (!$('#captcha_audio').length) {
+          const audioButton = $(`
+            <button
+              title="播放驗證碼語音"
+              type="button"
+              onclick="document.getElementById('captcha_audio').play();"
+              class="fas fa-volume-up"
+              aria-label="播放驗證碼語音"
+              role="button"
+              style="font-size: 1.5em; color: #333; cursor: pointer; border: 2px solid #333; padding: 0.2em;">
+              <span class="sr-only">播放驗證碼語音</span>
+            </button>
+          `);
+          const audio = $('<audio id="captcha_audio" src="/rucaptcha/?format=wav&amp;locale=zh_tw"></audio>');
+          $('.rucaptcha-image').after(audioButton, audio);
+        }
      }
+      // <<< 修正結束
  });

  //萬用表格searchbtn2
@ -3139,11 +3140,15 @@ $(document).ready(function() {
 });
 //post
 $(document).ready(function () {
-  setTimeout(function () {
-    $('iframe.twitter-share-button, iframe.twitter-tweet-button').each(function () {
-      $(this).attr('title', '分享至 X 在新視窗開啟');
-    });
-  }, 1500);
+    setTimeout(function () {
+        var pageLang = ($('html').attr('lang') || 'zh-Hant').toLowerCase();
+        var isEn = pageLang.startsWith('en');
+        var title = isEn ? 'Share to X Open in new window' : '分享至 X 在新視窗開啟';
+
+        $('iframe.twitter-share-button, iframe.twitter-tweet-button').each(function () {
+            $(this).attr('title', title);
+        });
+    }, 1500);
 });
 $(function() {
  function bindIframeFocus() {
@ -3375,4 +3380,82 @@ $(document).ready(function () {
  }, 500);
 });

+  //banner英文
+  $(function() {
+    function fixBannerA11yByLang() {
+        setTimeout(function() {
+            var pageLang = ($('html').attr('lang') || 'zh-Hant').toLowerCase();
+            var isEn = pageLang.startsWith('en');
+
+            var i18n = {
+                playControls: isEn ? 'Playback Controls'   : '播放控制選項',
+                resume:       isEn ? 'Play'                 : '繼續播放',
+                pause:        isEn ? 'Pause'                : '暫停播放',
+                prev:         isEn ? 'Previous'             : '上一張',
+                next:         isEn ? 'Next'                 : '下一張',
+                slide:        isEn ? 'Slide'                : '第',
+                slideUnit:    isEn ? ''                     : ' 張投影片'
+            };
+
+            $('.w-ba-banner').each(function() {
+                var $banner = $(this);
+
+                // ✅ 播放控制選項 radiogroup label
+                $banner.find('.controlplay').attr('aria-label', i18n.playControls);
+
+                // ✅ 繼續播放按鈕
+                $banner.find('.resume-slide').attr({
+                    'aria-label': i18n.resume,
+                    'title': i18n.resume
+                });
+                $banner.find('.resume-slide p').text(i18n.resume);
+
+                // ✅ 暫停播放按鈕
+                $banner.find('.pause-slide').attr({
+                    'aria-label': i18n.pause,
+                    'title': i18n.pause
+                });
+                $banner.find('.pause-slide p').text(i18n.pause);
+
+                // ✅ 上一張按鈕
+                $banner.find('.prev-button').attr('aria-label', i18n.prev);
+
+                // ✅ 下一張按鈕
+                $banner.find('.next-button').attr('aria-label', i18n.next);
+
+                // ✅ Pager 按鈕
+                var $slides = $banner.find('.w-ba-banner__slide');
+                $banner.find('.banner-pager button').each(function(index) {
+                    var slideTitle = $slides.eq(index).data('cycle-title') || '';
+                    var ariaLabel = isEn
+                        ? i18n.slide + ' ' + (index + 1) + (slideTitle ? ' ' + slideTitle : '')
+                        : i18n.slide + (index + 1) + i18n.slideUnit + (slideTitle ? ' ' + slideTitle : '');
+                    $(this).attr({
+                        'aria-label': ariaLabel,
+                        'title': ariaLabel
+                    });
+                });
+            });
+
+            // ✅ Cycle2 初始化後也重新處理 Pager（因為 pager 是動態產生的）
+            $('.w-ba-banner .cycle-slideshow').on('cycle-post-initialize cycle-after', function() {
+                var $banner = $(this).closest('.w-ba-banner');
+                var $slides = $banner.find('.w-ba-banner__slide');
+                $banner.find('.banner-pager button').each(function(index) {
+                    var slideTitle = $slides.eq(index).data('cycle-title') || '';
+                    var ariaLabel = isEn
+                        ? i18n.slide + ' ' + (index + 1) + (slideTitle ? ' ' + slideTitle : '')
+                        : i18n.slide + (index + 1) + i18n.slideUnit + (slideTitle ? ' ' + slideTitle : '');
+                    $(this).attr({
+                        'aria-label': ariaLabel,
+                        'title': ariaLabel
+                    });
+                });
+            });
+
+        }, 800);
+    }
+
+    fixBannerA11yByLang();
+  });
 }(jQuery, window));
--- a/assets/stylesheets/template/modules/announcement.scss
+++ b/assets/stylesheets/template/modules/announcement.scss
@ -546,7 +546,7 @@
      }
    }
  }
-  .w-annc__subtitle{
+  .w-annc__subtitle,p{
    color: #fff;
    font-size: 1rem;
    display: -webkit-box;
@ -560,6 +560,8 @@
    opacity: 0;
    -webkit-transition: max-height .6s,opacity .6s;
    transition: max-height .6s,opacity .6s;
+    padding-bottom: 0;
+    margin-bottom: 0;
    @media(min-width:1920px){
      font-size: 1.2em;
    }
@ -597,7 +599,7 @@
          .card:before{
            height:100%;
          }
-            .w-annc__subtitle{
+            .w-annc__subtitle,p{
              max-height: 100px;
              opacity: 1;
            }
@ -801,7 +803,7 @@
      }
    }
  }
-  .w-annc__subtitle{
+  .w-annc__subtitle,p{
    color: #fff;
    font-size: 1rem;
    display: -webkit-box;
@ -815,6 +817,8 @@
    opacity: 0;
    -webkit-transition: max-height .6s,opacity .6s;
    transition: max-height .6s,opacity .6s;
+    padding-bottom: 0;
+    margin-bottom: 0;
    @media(min-width:1920px){
      font-size: 1.2em;
    }
@ -847,7 +851,7 @@
          .card:before{
            height:100%;
          }
-            .w-annc__subtitle{
+            .w-annc__subtitle,p{
              max-height: 100px;
              opacity: 1;
            }
@ -1162,7 +1166,7 @@
      }
    }
  }
-  .w-annc__subtitle{
+  .w-annc__subtitle,p{
    color: #fff;
    font-size: 1rem;
    display: -webkit-box;
@ -1176,6 +1180,8 @@
    opacity: 0;
    -webkit-transition: max-height .6s,opacity .6s;
    transition: max-height .6s,opacity .6s;
+    padding-bottom: 0;
+    margin-bottom: 0;
    @media(min-width:1920px){
      font-size: 1.2em;
    }
@ -1254,7 +1260,7 @@
          .card:before{
            height:100%;
          }
-            .w-annc__subtitle{
+            .w-annc__subtitle,p{
              max-height: 100px;
              opacity: 1;
            }
@ -1500,7 +1506,7 @@
      }
    }
  }
-  .w-annc__subtitle{
+  .w-annc__subtitle,p{
    color: #fff;
    font-size: 1rem;
    display: -webkit-box;
@ -1514,6 +1520,8 @@
    opacity: 0;
    -webkit-transition: max-height .6s,opacity .6s;
    transition: max-height .6s,opacity .6s;
+    padding-bottom: 0;
+    margin-bottom: 0;
    @media(min-width:1920px){
      font-size: 1.2em;
    }
@ -1546,7 +1554,7 @@
          .card:before{
            height:100%;
          }
-            .w-annc__subtitle{
+            .w-annc__subtitle,p{
              max-height: 100px;
              opacity: 1;
            }
@ -1600,7 +1608,7 @@
      font-size: 1.6rem!important;
    }
  }
-  .w-annc__subtitle{
+  .w-annc__subtitle,p{
    color: #fff;
    font-size: 1rem;
    display: -webkit-box;
@ -1614,6 +1622,8 @@
    opacity: 0;
    -webkit-transition: max-height .6s,opacity .6s;
    transition: max-height .6s,opacity .6s;
+    padding-bottom: 0;
+    margin-bottom: 0;
    @media(min-width:1920px){
      font-size: 1.2em;
    }
@ -1661,7 +1671,7 @@
          .card:before{
            height:100%;
          }
-            .w-annc__subtitle{
+            .w-annc__subtitle,p{
              max-height: 100px;
              opacity: 1;
            }
--- a/assets/stylesheets/template/modules/event_news.scss
+++ b/assets/stylesheets/template/modules/event_news.scss
@ -233,7 +233,7 @@
      }
    }
  }
-  .w-annc__subtitle{
+  .w-annc__subtitle,p{
    color: #fff;
    font-size: 1rem;
    display: -webkit-box;
@ -247,6 +247,8 @@
    opacity: 0;
    -webkit-transition: max-height .6s,opacity .6s;
    transition: max-height .6s,opacity .6s;
+    padding-bottom: 0;
+    margin-bottom: 0;
    @media(min-width:1920px){
      font-size: 1.2em;
    }
@ -279,7 +281,7 @@
          .card:before{
            height:100%;
          }
-            .w-annc__subtitle{
+            .w-annc__subtitle,p{
              max-height: 100px;
              opacity: 1;
            }
--- a/modules/ad_banner/_ad_banner_widget2.html.erb
+++ b/modules/ad_banner/_ad_banner_widget2.html.erb
@ -23,13 +23,13 @@
        data-overlay-template="<h3>{{title}}</h3>{{desc}}"
        data-bs-target="{{target}}"
      >
-       <div>
+       <a href="{{link}}" target="{{target}}" title="{{alt_title}}">
           <img class="w-ba-banner__image banner-responsive" src="{{image_link}}" alt="{{alt_title}}">
-       </div>
+       </a>

    </div>
  </div>
-    <div class="w-ad-banner__pager-2 w-ba-banner__caption banner-pager banner_caption_{{subpart-id}}" data-list="images" data-level="0">
+  <div class="w-ad-banner__pager-2 w-ba-banner__caption banner-pager banner_caption_{{subpart-id}}" data-list="images" data-level="0">
    <li><button title="Slide {{slide_number}}" aria-label="Pager"><span style="display: none;">Slide {{slide_number}}</span></button></li>
  </div>
  <ul class="controlplay" role="radiogroup" aria-label="播放控制選項">
@ -92,6 +92,12 @@
  .w-ba-banner .controlplay{
    width: auto;
  }
+  .w-ba-banner .button-mid{
+    position: absolute;
+    width: 100%;
+    height: 0;
+    top: 50%;
+  }
  .next-button,.prev-button{
    cursor: pointer;
  }