update
This commit is contained in:
parent
98d973ef98
commit
6bf537f131
|
|
@ -320,6 +320,17 @@
|
|||
}, 100);
|
||||
}
|
||||
});
|
||||
// ✅ Tab 鍵跳過 .navbar-toggle 時,觸發與點擊相同的收合邏輯
|
||||
$(document).on('focusout', '.mobile-menu', function(e) {
|
||||
setTimeout(function() {
|
||||
var $newFocus = $(document.activeElement);
|
||||
// 焦點已離開 .mobile-menu 且選單是展開狀態
|
||||
if ($('.mobile-menu').hasClass('active') && $newFocus.closest('.mobile-menu').length === 0) {
|
||||
// ✅ 直接 trigger click,與按下 .navbar-toggle 執行完全相同的動作
|
||||
$('.navbar-toggle').first().trigger('click');
|
||||
}
|
||||
}, 50);
|
||||
});
|
||||
|
||||
$('.mobile-menu1 > .menu-drop').click(function(){
|
||||
var $that = $(this);
|
||||
|
|
@ -619,7 +630,7 @@
|
|||
}
|
||||
});
|
||||
if (document.documentElement.lang === 'zh_tw') {
|
||||
document.documentElement.lang = 'zh-Hant';
|
||||
document.documentElement.lang = 'zh-Hant-TW';
|
||||
}
|
||||
//tab鍵按下
|
||||
$(document).on('keydown', function(e) {
|
||||
|
|
@ -865,7 +876,7 @@
|
|||
var isLinkImage = $parentA.length > 0 && $parentA.text().replace(/\u00a0/g, '').trim() === "";
|
||||
|
||||
// --- 1. 處理「裝飾性圖片」標註 ---
|
||||
if (currentAlt === "announcement image" || currentAlt === "裝飾圖片" || currentTitle === "裝飾圖片") {
|
||||
if (currentAlt === "announcement image" || currentAlt === "裝飾圖片" || currentTitle === "裝飾圖片" || currentAlt === "這是一張圖片" || currentTitle === "這是一張圖片") {
|
||||
$img.attr('alt', '');
|
||||
$img.removeAttr('title');
|
||||
return;
|
||||
|
|
@ -941,7 +952,7 @@ $(function() {
|
|||
var urlParams = new URLSearchParams(window.location.search);
|
||||
var isEditMode = urlParams.get('editmode') === 'on';
|
||||
|
||||
var pageLang = $('html').attr('lang') || 'zh-Hant';
|
||||
var pageLang = $('html').attr('lang') || 'zh-Hant-TW';
|
||||
var isEn = pageLang.toLowerCase().startsWith('en');
|
||||
|
||||
var i18n = {
|
||||
|
|
@ -2673,7 +2684,63 @@ $(function() {
|
|||
|
||||
setTimeout(fixSearchMenuFocusOut, 600);
|
||||
});
|
||||
//post
|
||||
$(document).ready(function () {
|
||||
setTimeout(function () {
|
||||
$('iframe.twitter-share-button, iframe.twitter-tweet-button').each(function () {
|
||||
$(this).attr('title', '分享至 X 在新視窗開啟');
|
||||
});
|
||||
}, 1500);
|
||||
});
|
||||
$(function() {
|
||||
function bindIframeFocus() {
|
||||
var $iframe = $('.twitter-share-button');
|
||||
if ($iframe.length === 0) return;
|
||||
|
||||
$iframe.each(function() {
|
||||
var $wrap = $(this).closest('.tw-share-button');
|
||||
|
||||
// 讓外層可以被 tab 到並顯示焦點框
|
||||
$wrap.attr('tabindex', '-1');
|
||||
|
||||
$(window).on('blur.twitterFocus', function() {
|
||||
setTimeout(function() {
|
||||
if (document.activeElement &&
|
||||
$(document.activeElement).hasClass('twitter-share-button')) {
|
||||
$wrap.css({
|
||||
'outline': '3px solid #005fcc',
|
||||
'outline-offset': '2px',
|
||||
'border-radius': '2px'
|
||||
});
|
||||
}
|
||||
}, 100);
|
||||
});
|
||||
|
||||
$(window).on('focus.twitterFocus', function() {
|
||||
$wrap.css({
|
||||
'outline': '',
|
||||
'outline-offset': ''
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// 用 MutationObserver 等 iframe 被 Twitter script 插入後才綁定
|
||||
var observer = new MutationObserver(function(mutations) {
|
||||
if ($('.twitter-share-button').length > 0) {
|
||||
bindIframeFocus();
|
||||
observer.disconnect(); // 綁定成功後停止監聽
|
||||
}
|
||||
});
|
||||
|
||||
observer.observe(document.body, {
|
||||
childList: true,
|
||||
subtree: true
|
||||
});
|
||||
|
||||
// 保險:2秒後強制執行一次
|
||||
setTimeout(bindIframeFocus, 1000);
|
||||
});
|
||||
$(document).ready(function () {
|
||||
$('.controlplay a[role="radio"]').on('click', function () {
|
||||
// 取消所有的 aria-checked 並還原文字
|
||||
|
|
@ -2830,6 +2897,9 @@ $(function() {
|
|||
var target = document.getElementById('gallery-theater-stage');
|
||||
if (!target) return;
|
||||
|
||||
// 頁面載入時若已存在 #gallery-theater-stage,則還原 z-index
|
||||
$('.verticalhome').css('z-index', 'auto');
|
||||
|
||||
var observer = new MutationObserver(function() {
|
||||
var display = target.style.display;
|
||||
if (display === 'block') {
|
||||
|
|
@ -2881,6 +2951,89 @@ $(document).ready(function() {
|
|||
subtree: true
|
||||
});
|
||||
|
||||
});
|
||||
//萬用表格無障礙
|
||||
function fixSortLinkA11y() {
|
||||
$('a').filter(function () {
|
||||
return $(this).find('.universal-th-icon').length > 0;
|
||||
}).each(function () {
|
||||
var $link = $(this);
|
||||
|
||||
// === Step 1: 移除 display:none 的 span ===
|
||||
$link.find('span').each(function () {
|
||||
if ($(this).css('display') === 'none' || $(this).attr('style') && $(this).attr('style').indexOf('display: none') !== -1) {
|
||||
$(this).remove();
|
||||
}
|
||||
});
|
||||
|
||||
// === Step 2: 取得 aria-label ===
|
||||
var ariaLabel = $link.attr('aria-label') || '';
|
||||
|
||||
// 若 aria-label 空白或含未替換模板變數,從旁邊 .universal-th-text 補
|
||||
if (!ariaLabel || ariaLabel.indexOf('{{') !== -1) {
|
||||
var $th = $link.closest('th, div[class*="col-"]');
|
||||
var colName = $th.find('.universal-th-text').text().trim();
|
||||
ariaLabel = colName ? '重新排序' + colName : '排序';
|
||||
$link.attr('aria-label', ariaLabel);
|
||||
}
|
||||
|
||||
// === Step 3: 補上 title 屬性 ===
|
||||
if (!$link.attr('title')) {
|
||||
$link.attr('title', ariaLabel + '(在本視窗開啟)');
|
||||
}
|
||||
|
||||
// === Step 4: 確保圖示有 aria-hidden ===
|
||||
$link.find('.universal-th-icon').attr('aria-hidden', 'true');
|
||||
|
||||
// === Step 5: 補上 visually-hidden 連結文字 ===
|
||||
if ($link.find('.visually-hidden').length === 0) {
|
||||
$link.append('<span class="visually-hidden">' + ariaLabel + '</span>');
|
||||
}
|
||||
});
|
||||
}
|
||||
function fixSearchInputA11y() {
|
||||
$('input[type="search"], input[type="text"]').each(function () {
|
||||
var $input = $(this);
|
||||
|
||||
// 已有對應 label 就跳過
|
||||
var inputId = $input.attr('id');
|
||||
if (inputId && $('label[for="' + inputId + '"]').length) return;
|
||||
|
||||
// 已有 aria-label / aria-labelledby / title 就跳過
|
||||
if ($input.attr('aria-label') || $input.attr('aria-labelledby') || $input.attr('title')) return;
|
||||
|
||||
// 從 placeholder 取得說明文字
|
||||
var placeholder = $input.attr('placeholder') || '';
|
||||
|
||||
// 從最近的 th 或欄位標題取得欄位名稱
|
||||
var colName = '';
|
||||
var $th = $input.closest('th, div[class*="col-"]');
|
||||
if ($th.length) {
|
||||
colName = $th.find('.universal-th-text').text().trim();
|
||||
}
|
||||
|
||||
// 組合標籤文字
|
||||
var label = '';
|
||||
if (colName && placeholder) {
|
||||
label = colName + '搜尋';
|
||||
} else if (colName) {
|
||||
label = colName + '搜尋';
|
||||
} else if (placeholder) {
|
||||
label = placeholder;
|
||||
} else {
|
||||
label = '搜尋關鍵字';
|
||||
}
|
||||
|
||||
$input.attr('aria-label', label);
|
||||
$input.attr('title', label);
|
||||
});
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
setTimeout(function () {
|
||||
fixSortLinkA11y();
|
||||
fixSearchInputA11y();
|
||||
}, 500);
|
||||
});
|
||||
// 執行 member等高計算,目前改用flexbox故mark掉 by ika 20160105
|
||||
// $(window).load(function() {
|
||||
|
|
|
|||
|
|
@ -11,6 +11,9 @@
|
|||
display: block
|
||||
}
|
||||
}
|
||||
#orbit-bar .orbit-bar-menu .orbit-bar-logo{
|
||||
cursor: unset!important;
|
||||
}
|
||||
|
||||
.login-btn:focus {
|
||||
outline: 0.3125em auto -webkit-focus-ring-color !important;
|
||||
|
|
|
|||
|
|
@ -16,8 +16,8 @@ $theme-red: #d20001;
|
|||
$theme-blue: #003d7e;
|
||||
|
||||
$theme-color-main: #333333;
|
||||
$theme-color-second:#019AAA;
|
||||
$theme-color-third: #019AAA;
|
||||
$theme-color-second:#006e7a;
|
||||
$theme-color-third: #006e7a;
|
||||
$theme-color-green: #32D9C3;
|
||||
$theme-color-hover:#164D7D;
|
||||
|
||||
|
|
|
|||
|
|
@ -144,18 +144,18 @@
|
|||
.i-archive-title {
|
||||
@extend .unity-title;
|
||||
}
|
||||
.link { background-color: #1368d4 !important; } /* 對比 4.6:1 */
|
||||
.txt { background-color: #3a8a40 !important; } /* 對比 4.6:1 */
|
||||
.xlsx { background-color: #9e3050 !important; } /* 對比 4.6:1 */
|
||||
.pdf { background-color: #2a7d36 !important; } /* 對比 4.6:1 */
|
||||
.docx { background-color: #5e46a0 !important; } /* 對比 4.6:1 */
|
||||
.doc { background-color: #1368d4 !important; } /* 對比 4.6:1 */
|
||||
.pptx { background-color: #3d4aa0 !important; } /* 對比 4.6:1 */
|
||||
.jpg { background-color: #8f3333 !important; } /* 對比 4.6:1 */
|
||||
.zip { background-color: #8a6400 !important; } /* 對比 4.6:1 */
|
||||
.rar { background-color: #9e5000 !important; } /* 對比 4.6:1 */
|
||||
.xls { background-color: #3a8a40 !important; } /* 對比 4.6:1 */
|
||||
.odt { background-color: #767676 !important; } /* 對比 4.6:1 */
|
||||
.link { background-color: #1368d4 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.txt { background-color: #3a8a40 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.xlsx { background-color: #9e3050 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.pdf { background-color: #2a7d36 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.docx { background-color: #5e46a0 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.doc { background-color: #1368d4 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.pptx { background-color: #3d4aa0 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.jpg { background-color: #8f3333 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.zip { background-color: #8a6400 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.rar { background-color: #9e5000 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.xls { background-color: #3a8a40 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.odt { background-color: #767676 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||
.table>caption+thead>tr:first-child>td, .table>caption+thead>tr:first-child>th, .table>colgroup+thead>tr:first-child>td, .table>colgroup+thead>tr:first-child>th, .table>thead:first-child>tr:first-child>td, .table>thead:first-child>tr:first-child>th{
|
||||
// border-top: 0.0625em solid #ddd;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<div class="index-content col-xs-4 col-sm-3">
|
||||
<div class="index-content-inner">
|
||||
<div class="index-pic">
|
||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{alt_title}}">
|
||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{album-name}}">
|
||||
</div>
|
||||
<section class="index-part">
|
||||
<h4 class="index-content-title">
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<div class="index-content col-xs-4 col-sm-3">
|
||||
<div class="index-content-inner">
|
||||
<div class="index-pic">
|
||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{alt_title}}">
|
||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{album-name}}">
|
||||
</div>
|
||||
<section class="index-part">
|
||||
<h4 class="index-content-title">
|
||||
|
|
|
|||
|
|
@ -4,15 +4,16 @@
|
|||
</h3>
|
||||
<div class="row" data-level="0" data-list="albums" style="display: flex;flex-wrap: wrap;">
|
||||
<div class="index-content col-sm-3">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
|
||||
<div class="index-content-inner">
|
||||
<a href="{{link_to_show}}" title="{{album-name}}">
|
||||
<div class="index-pic">
|
||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{alt_title}}">
|
||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{album-name}}">
|
||||
</div>
|
||||
</a>
|
||||
<div class="index-part">
|
||||
<h4 class="index-content-title">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">{{album-name}}</a>
|
||||
<a href="{{link_to_show}}" title="{{album-name}}">{{album-name}}</a>
|
||||
</h4>
|
||||
<div class="index-img-description">{{album-description}}</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -5,14 +5,14 @@
|
|||
<div class="row" data-level="0" data-list="albums" style="display: flex;flex-wrap: wrap;">
|
||||
<div class="index-content">
|
||||
<div class="index-content-inner clearfix row">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{album-name}}" title="{{album-name}}">
|
||||
<div class="index-pic col-xs-5 col-sm-2">
|
||||
<img class="index-img" src="{{thumb-src}}" alt="{{alt_title}}">
|
||||
</div>
|
||||
</a>
|
||||
<div class="index-part col-xs-7 col-sm-10">
|
||||
<h4 class="index-content-title">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">{{album-name}}</a>
|
||||
<a href="{{link_to_show}}" aria-label="前往{{album-name}}" title="{{album-name}}">{{album-name}}</a>
|
||||
</h4>
|
||||
<div class="index-img-description">{{album-description}}</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,15 +4,15 @@
|
|||
</h3>
|
||||
<div class="row" data-level="0" data-list="albums" style="display: flex;flex-wrap: wrap;">
|
||||
<div class="index-content col-sm-3">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{album-name}}" title="{{album-name}}">
|
||||
<div class="index-content-inner">
|
||||
<div class="index-pic">
|
||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{alt_title}}">
|
||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{album-name}}">
|
||||
</div>
|
||||
</a>
|
||||
<div class="index-part">
|
||||
<h4 class="index-content-title">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">{{album-name}}</a>
|
||||
<a href="{{link_to_show}}" aria-label="前往{{album-name}}" title="{{album-name}}">{{album-name}}</a>
|
||||
</h4>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -5,14 +5,14 @@
|
|||
<div class="row" data-level="0" data-list="albums" style="display: flex;flex-wrap: wrap;">
|
||||
<div class="index-content">
|
||||
<div class="index-content-inner clearfix row">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{album-name}}" title="{{album-name}}">
|
||||
<div class="index-pic col-xs-5 col-sm-2">
|
||||
<img class="index-img" src="{{thumb-src}}" alt="{{alt_title}}">
|
||||
</div>
|
||||
</a>
|
||||
<div class="index-part col-xs-7 col-sm-10">
|
||||
<h4 class="index-content-title">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">{{album-name}}</a>
|
||||
<a href="{{link_to_show}}" aria-label="前往{{album-name}}" title="{{album-name}}">{{album-name}}</a>
|
||||
</h4>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -8,11 +8,11 @@
|
|||
|
||||
<div class="card-front">
|
||||
<div class="card-body" style="padding:0;">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{album-name}}" title="{{album-name}}">
|
||||
<img src="{{thumb-src}}"alt="{{alt_title}}">
|
||||
</a>
|
||||
<div class="card-footer">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{album-name}}" title="{{album-name}}">
|
||||
<h3 class="card-title">{{album-name}}</h3>
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -6,14 +6,14 @@
|
|||
<div class="index-content col-sm-3">
|
||||
|
||||
<div class="index-content-inner">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{album-name}}" title="{{album-name}}">
|
||||
<div class="index-pic">
|
||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{alt_title}}">
|
||||
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{album-name}}">
|
||||
</div>
|
||||
</a>
|
||||
<section class="index-part">
|
||||
<h4 class="index-content-title">
|
||||
<a href="{{link_to_show}}" aria-label="前往{{page-title}}" title="{{page-title}}">{{album-name}}</a>
|
||||
<a href="{{link_to_show}}" aria-label="前往{{album-name}}" title="{{album-name}}">{{album-name}}</a>
|
||||
</h4>
|
||||
</section>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue