update
This commit is contained in:
parent
269f215855
commit
2d64c27bd0
|
|
@ -1107,56 +1107,59 @@ $(function() {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// E. 重新計算標題 (關鍵邏輯:若 hasOriginalTitle 為真,則不進入此區塊)
|
// E. 重新計算標題 (關鍵邏輯:若 hasOriginalTitle 為真,則不進入此區塊)
|
||||||
if (!hasOriginalTitle) {
|
if (!hasOriginalTitle) {
|
||||||
if (linkText === "" && $img.length > 0) {
|
if (linkText === "" && $img.length > 0) {
|
||||||
var rawAlt = ($img.attr('alt') || '').trim();
|
var rawAlt = ($img.attr('alt') || '').trim();
|
||||||
var forbidden = ['這是一張圖片', '圖片', 'image', 'photo', '圖', ''];
|
var forbidden = ['這是一張圖片', '圖片', 'image', 'photo', '圖', ''];
|
||||||
var imgAlt = forbidden.some(function(txt) { return rawAlt.toLowerCase() === txt; })
|
var imgAlt = forbidden.some(function(txt) { return rawAlt.toLowerCase() === txt; })
|
||||||
? ($a.attr('aria-label') || i18n.link) : rawAlt;
|
? ($a.attr('aria-label') || i18n.link) : rawAlt;
|
||||||
|
|
||||||
var fileInfo = fileExt ? '[' + fileExt.toUpperCase() + '] ' : '';
|
var fileInfo = fileExt ? '[' + fileExt.toUpperCase() + '] ' : '';
|
||||||
$a.attr('title', (fileInfo + imgAlt + " " + windowTask).trim());
|
$a.attr('title', (fileInfo + imgAlt + " " + windowTask).trim());
|
||||||
$img.attr('alt', imgAlt);
|
$img.attr('alt', imgAlt);
|
||||||
}
|
}
|
||||||
else if (linkText !== "") {
|
else if (linkText !== "") {
|
||||||
if (fileExt !== "" || hasBadSymbol || currentTitle === "" || currentTitle.includes('/uploads/')) {
|
if (fileExt !== "" || hasBadSymbol || currentTitle === "" || currentTitle.includes('/uploads/')) {
|
||||||
if (fileExt !== "") {
|
if (fileExt !== "") {
|
||||||
$a.attr('title', linkText + " ." + fileExt + " " + windowTask);
|
$a.attr('title', linkText + " ." + fileExt + " " + windowTask);
|
||||||
} else {
|
} else {
|
||||||
$a.attr('title', windowTask);
|
$a.attr('title', windowTask);
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// ✅ 符合 HM1240404E:title 不應與連結文字或圖片 alt 重複
|
// ✅ 符合 HM1240404E:title 不應與連結文字或圖片 alt 重複
|
||||||
if (hasOriginalTitle && currentTitle !== "") {
|
if (hasOriginalTitle && currentTitle !== "") {
|
||||||
var titleWithoutWindow = currentTitle
|
var titleWithoutWindow = currentTitle
|
||||||
.replace('(在本視窗開啟)', '')
|
.replace('(在本視窗開啟)', '')
|
||||||
.replace('(在新視窗開啟)', '')
|
.replace('(在新視窗開啟)', '')
|
||||||
.replace('Open in this window', '')
|
.replace('Open in this window', '')
|
||||||
.replace('Open in new window', '')
|
.replace('Open in new window', '')
|
||||||
.replace('另開新視窗前往', '')
|
.replace('另開新視窗前往', '')
|
||||||
.replace('另開新視窗', '')
|
.replace('另開新視窗', '')
|
||||||
.trim();
|
.trim();
|
||||||
|
|
||||||
// ✅ title 去掉開窗字串後,若與連結文字或圖片原始 alt 相同,則只保留開窗提示
|
// ✅ title 去掉開窗字串後,若與連結文字或圖片原始 alt 相同,則只保留開窗提示
|
||||||
if (
|
// ✅ 新增:若 linkText 包含副檔名且 title 也是同樣檔名,也只保留開窗提示
|
||||||
(titleWithoutWindow === linkText && linkText !== i18n.link) ||
|
if (
|
||||||
(imgAltOriginal !== '' && titleWithoutWindow === imgAltOriginal)
|
(titleWithoutWindow === linkText && linkText !== i18n.link) ||
|
||||||
) {
|
(imgAltOriginal !== '' && titleWithoutWindow === imgAltOriginal) ||
|
||||||
$a.attr('title', windowTask);
|
(fileExt !== '' && linkText.toLowerCase().endsWith('.' + fileExt) && titleWithoutWindow === linkText)
|
||||||
}
|
) {
|
||||||
|
$a.attr('title', windowTask);
|
||||||
// ✅ 最終清理:若 title 出現空括號 () 則移除並補上正確開窗提示
|
return; // ✅ 加上 return,避免繼續執行後面的清理邏輯造成二次污染
|
||||||
var finalTitle = ($a.attr('title') || '').trim();
|
|
||||||
if (finalTitle.includes('()')) {
|
|
||||||
finalTitle = finalTitle.replace(/\(\)/g, '').trim();
|
|
||||||
$a.attr('title', finalTitle + ' ' + windowTask);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// ✅ 最終清理:若 title 出現空括號 () 則移除並補上正確開窗提示
|
||||||
|
var finalTitle = ($a.attr('title') || '').trim();
|
||||||
|
if (finalTitle.includes('()')) {
|
||||||
|
finalTitle = finalTitle.replace(/\(\)/g, '').trim();
|
||||||
|
$a.attr('title', finalTitle + ' ' + windowTask);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// F. 最終清理:移除冗餘 label,避免螢幕閱讀器唸兩次
|
// F. 最終清理:移除冗餘 label,避免螢幕閱讀器唸兩次
|
||||||
$a.removeAttr('aria-label');
|
$a.removeAttr('aria-label');
|
||||||
});
|
});
|
||||||
|
|
@ -1190,6 +1193,47 @@ $(function() {
|
||||||
fixAccessibilityAll();
|
fixAccessibilityAll();
|
||||||
}, 800);
|
}, 800);
|
||||||
});
|
});
|
||||||
|
// 修正漢堡選單按鈕無障礙
|
||||||
|
$(function() {
|
||||||
|
function fixNavbarToggleA11y() {
|
||||||
|
var isEn = $('html').attr('lang') === 'en';
|
||||||
|
var label = isEn ? '開啟或關閉導覽選單' : '開啟或關閉導覽選單';
|
||||||
|
|
||||||
|
$('.navbar-toggle').each(function() {
|
||||||
|
var $btn = $(this);
|
||||||
|
|
||||||
|
// 修正 title
|
||||||
|
$btn.attr('title', label);
|
||||||
|
|
||||||
|
// 修正 sr-only 文字(原本是 "Toggle navigation")
|
||||||
|
var $sr = $btn.find('.sr-only');
|
||||||
|
if ($sr.length) {
|
||||||
|
$sr.text(label);
|
||||||
|
} else {
|
||||||
|
$btn.prepend('<span class="sr-only">' + label + '</span>');
|
||||||
|
}
|
||||||
|
|
||||||
|
// 補上 aria-label
|
||||||
|
$btn.attr('aria-label', label);
|
||||||
|
|
||||||
|
// 補上 aria-expanded(依據目前是否展開)
|
||||||
|
if (!$btn.attr('aria-expanded')) {
|
||||||
|
var isExpanded = !$btn.hasClass('collapsed');
|
||||||
|
$btn.attr('aria-expanded', isExpanded ? 'true' : 'false');
|
||||||
|
}
|
||||||
|
|
||||||
|
// 點擊時同步更新 aria-expanded
|
||||||
|
$btn.off('click.navA11y').on('click.navA11y', function() {
|
||||||
|
setTimeout(function() {
|
||||||
|
var isExpanded = !$('.navbar-toggle').hasClass('collapsed');
|
||||||
|
$('.navbar-toggle').attr('aria-expanded', isExpanded ? 'true' : 'false');
|
||||||
|
}, 50);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
setTimeout(fixNavbarToggleA11y, 500);
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
$(function() {
|
$(function() {
|
||||||
|
|
@ -3066,6 +3110,208 @@ $(document).ready(function () {
|
||||||
fixSortLinkA11y();
|
fixSortLinkA11y();
|
||||||
fixSearchInputA11y();
|
fixSearchInputA11y();
|
||||||
}, 500);
|
}, 500);
|
||||||
|
});
|
||||||
|
//會員tab邏輯
|
||||||
|
$(document).ready(function () {
|
||||||
|
setTimeout(function () {
|
||||||
|
$('.dtr-control').removeAttr('tabindex');
|
||||||
|
}, 500);
|
||||||
|
});
|
||||||
|
function fixTabKeyboardNav() {
|
||||||
|
setTimeout(function () {
|
||||||
|
var $tablist = $('.member-plugins[role="tablist"]');
|
||||||
|
var $tabs = $tablist.find('a[role="tab"]');
|
||||||
|
|
||||||
|
// 初始化 roving tabindex 和 aria-selected
|
||||||
|
$tabs.each(function (i) {
|
||||||
|
var $tab = $(this);
|
||||||
|
var isActive = $tab.closest('li').hasClass('active');
|
||||||
|
$tab.attr({
|
||||||
|
'tabindex': isActive ? '0' : '-1',
|
||||||
|
'aria-selected': isActive ? 'true' : 'false'
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// 方向鍵切換頁籤
|
||||||
|
$tabs.on('keydown', function (e) {
|
||||||
|
var $current = $(this);
|
||||||
|
var currentIndex = $tabs.index($current);
|
||||||
|
var $target;
|
||||||
|
|
||||||
|
if (e.keyCode === 39 || e.keyCode === 40) {
|
||||||
|
// 右鍵或下鍵:下一個
|
||||||
|
e.preventDefault();
|
||||||
|
$target = $tabs.eq((currentIndex + 1) % $tabs.length);
|
||||||
|
} else if (e.keyCode === 37 || e.keyCode === 38) {
|
||||||
|
// 左鍵或上鍵:上一個
|
||||||
|
e.preventDefault();
|
||||||
|
$target = $tabs.eq((currentIndex - 1 + $tabs.length) % $tabs.length);
|
||||||
|
} else if (e.keyCode === 36) {
|
||||||
|
// Home:第一個
|
||||||
|
e.preventDefault();
|
||||||
|
$target = $tabs.first();
|
||||||
|
} else if (e.keyCode === 35) {
|
||||||
|
// End:最後一個
|
||||||
|
e.preventDefault();
|
||||||
|
$target = $tabs.last();
|
||||||
|
} else {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 更新 roving tabindex 和 aria-selected
|
||||||
|
$tabs.attr({ 'tabindex': '-1', 'aria-selected': 'false' });
|
||||||
|
$target.attr({ 'tabindex': '0', 'aria-selected': 'true' });
|
||||||
|
$target.focus().trigger('click');
|
||||||
|
});
|
||||||
|
|
||||||
|
// 點擊頁籤時同步更新狀態
|
||||||
|
$tabs.on('click', function () {
|
||||||
|
$tabs.attr({ 'tabindex': '-1', 'aria-selected': 'false' });
|
||||||
|
$(this).attr({ 'tabindex': '0', 'aria-selected': 'true' });
|
||||||
|
});
|
||||||
|
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
$(document).ready(function () {
|
||||||
|
fixTabKeyboardNav();
|
||||||
|
});
|
||||||
|
function removeBareUrlLinks() {
|
||||||
|
setTimeout(function() {
|
||||||
|
$('.dataTables_wrapper a').each(function() {
|
||||||
|
var $a = $(this);
|
||||||
|
var text = $a.text().trim();
|
||||||
|
|
||||||
|
if (/^https?:\/\//i.test(text)) {
|
||||||
|
$a.replaceWith(text);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
$(document).ready(function() {
|
||||||
|
removeBareUrlLinks();
|
||||||
|
});
|
||||||
|
//麵包屑無障礙
|
||||||
|
$(document).ready(function () {
|
||||||
|
$('.widget-breadcrumb .breadcrumb li:last-child a').attr('aria-current', 'page');
|
||||||
|
|
||||||
|
// 若尚未有 nav 包住,自動加上
|
||||||
|
$('.widget-breadcrumb .breadcrumb').each(function () {
|
||||||
|
if (!$(this).closest('nav').length) {
|
||||||
|
$(this).wrap('<nav aria-label="麵包屑導覽"></nav>');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
//gallery view
|
||||||
|
function fixGalleryViewLinkA11y() {
|
||||||
|
$('a.btn.view').each(function () {
|
||||||
|
var $a = $(this);
|
||||||
|
|
||||||
|
$a.find('span').each(function () {
|
||||||
|
var $span = $(this);
|
||||||
|
|
||||||
|
// 避免重複處理
|
||||||
|
if ($span.hasClass('sr-only')) return;
|
||||||
|
|
||||||
|
var style = $span.attr('style') || '';
|
||||||
|
if (style.indexOf('display: none') !== -1 || style.indexOf('display:none') !== -1) {
|
||||||
|
$span.removeAttr('style').addClass('sr-only');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$a.find('i, svg').attr('aria-hidden', 'true');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
$(document).ready(function () {
|
||||||
|
// 比 fixAccessibilityAll 的 800ms 晚,確保最後執行
|
||||||
|
setTimeout(fixGalleryViewLinkA11y, 2000);
|
||||||
|
});
|
||||||
|
|
||||||
|
$(function() {
|
||||||
|
function fixMemberAcademicLinkA11y() {
|
||||||
|
setTimeout(function() {
|
||||||
|
$('.i-member-item').each(function() {
|
||||||
|
var $item = $(this);
|
||||||
|
|
||||||
|
// ✅ 取得該成員的姓名
|
||||||
|
var memberName = $item.find('.member-data-value-name a').text().trim();
|
||||||
|
if (!memberName) return;
|
||||||
|
|
||||||
|
// ✅ 找到學術歷程連結,補上包含姓名的 title
|
||||||
|
$item.find('.member-data-value-11 a').each(function() {
|
||||||
|
var $a = $(this);
|
||||||
|
var currentTitle = $a.attr('title') || '';
|
||||||
|
|
||||||
|
// ✅ 移除舊的開窗字串,組合新 title
|
||||||
|
var titleWithoutWindow = currentTitle
|
||||||
|
.replace('另開新視窗前往', '')
|
||||||
|
.replace('在新視窗開啟', '')
|
||||||
|
.replace('在本視窗開啟', '')
|
||||||
|
.trim();
|
||||||
|
|
||||||
|
var isNewWindow = $a.attr('target') === '_blank';
|
||||||
|
var windowText = isNewWindow ? ' 在新視窗開啟' : ' 在本視窗開啟';
|
||||||
|
|
||||||
|
$a.attr('title', memberName + ' ' + titleWithoutWindow + windowText);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}, 500);
|
||||||
|
}
|
||||||
|
|
||||||
|
fixMemberAcademicLinkA11y();
|
||||||
|
});
|
||||||
|
//搜尋
|
||||||
|
$(document).ready(function() {
|
||||||
|
|
||||||
|
// 開啟
|
||||||
|
$('.btn-search-trigger').on('click', function() {
|
||||||
|
$('#searchOverlay').css('display', 'flex');
|
||||||
|
$('body').css('overflow', 'hidden');
|
||||||
|
setTimeout(function() {
|
||||||
|
$('#searchOverlayClose').focus(); // 先 focus 叉叉
|
||||||
|
}, 50);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 關閉叉叉
|
||||||
|
$('#searchOverlayClose').on('click', function() {
|
||||||
|
closeOverlay();
|
||||||
|
});
|
||||||
|
|
||||||
|
// ESC 關閉
|
||||||
|
$(document).on('keydown', function(e) {
|
||||||
|
if (e.key === 'Escape' && $('#searchOverlay').is(':visible')) {
|
||||||
|
closeOverlay();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// focus trap:Tab 鍵只在 overlay 內游走
|
||||||
|
$('#searchOverlay').on('keydown', function(e) {
|
||||||
|
if (e.key !== 'Tab') return;
|
||||||
|
|
||||||
|
var $focusable = $('#searchOverlay').find('button, input, [tabindex]').filter(':visible');
|
||||||
|
var $first = $focusable.first();
|
||||||
|
var $last = $focusable.last();
|
||||||
|
|
||||||
|
if (e.shiftKey) {
|
||||||
|
// Shift + Tab:到第一個就跳回最後一個
|
||||||
|
if ($(document.activeElement).is($first)) {
|
||||||
|
e.preventDefault();
|
||||||
|
$last.focus();
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// Tab:到最後一個就跳回第一個
|
||||||
|
if ($(document.activeElement).is($last)) {
|
||||||
|
e.preventDefault();
|
||||||
|
$first.focus();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
function closeOverlay() {
|
||||||
|
$('#searchOverlay').css('display', 'none');
|
||||||
|
$('body').css('overflow', '');
|
||||||
|
$('.btn-search-trigger').focus();
|
||||||
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
// 執行 member等高計算,目前改用flexbox故mark掉 by ika 20160105
|
// 執行 member等高計算,目前改用flexbox故mark掉 by ika 20160105
|
||||||
// $(window).load(function() {
|
// $(window).load(function() {
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,6 @@
|
||||||
|
|
||||||
a[accesskey] {
|
a[accesskey] {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
margin-left: -0.9375em;
|
|
||||||
color: transparent ;
|
color: transparent ;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -26,16 +26,16 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
label[for="open-orbit-login"] {
|
// label[for="open-orbit-login"] {
|
||||||
@media(max-width:768px){
|
// @media(max-width:768px){
|
||||||
display: none!important;
|
// display: none!important;
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
[accesskey="U"],[accesskey="W"]{
|
// [accesskey="U"],[accesskey="W"]{
|
||||||
@media(max-width:768px){
|
// @media(max-width:768px){
|
||||||
color: #666!important;
|
// color: #666!important;
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
.orbit-bar-inner{
|
.orbit-bar-inner{
|
||||||
[accesskey="U"]{
|
[accesskey="U"]{
|
||||||
height: 40px;
|
height: 40px;
|
||||||
|
|
|
||||||
|
|
@ -8,6 +8,9 @@
|
||||||
|
|
||||||
// Widget
|
// Widget
|
||||||
// ## gerenral styles
|
// ## gerenral styles
|
||||||
|
.w-ba-banner {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
ul.button-mid{
|
ul.button-mid{
|
||||||
margin:0;
|
margin:0;
|
||||||
z-index: 101;
|
z-index: 101;
|
||||||
|
|
|
||||||
|
|
@ -152,7 +152,7 @@
|
||||||
@extend .unity-title;
|
@extend .unity-title;
|
||||||
}
|
}
|
||||||
.link { background-color: #1368d4 !important; margin-left: 0.5em; } /* 對比 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 */
|
.txt { background-color: #2a7e31 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||||
.xlsx { background-color: #9e3050 !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 */
|
.pdf { background-color: #2a7d36 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||||
.docx { background-color: #5e46a0 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
.docx { background-color: #5e46a0 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||||
|
|
@ -161,7 +161,7 @@
|
||||||
.jpg { background-color: #8f3333 !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 */
|
.zip { background-color: #8a6400 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||||
.rar { background-color: #9e5000 !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 */
|
.xls { background-color: #2a7e31 !important; margin-left: 0.5em; } /* 對比 4.6:1 */
|
||||||
.odt { background-color: #767676 !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{
|
.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;
|
// border-top: 0.0625em solid #ddd;
|
||||||
|
|
|
||||||
|
|
@ -65,7 +65,22 @@
|
||||||
})
|
})
|
||||||
$('[data-subpart-id="{{subpart-id}}"] .prev-button').click(function(){
|
$('[data-subpart-id="{{subpart-id}}"] .prev-button').click(function(){
|
||||||
$(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle("prev");
|
$(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle("prev");
|
||||||
})
|
});
|
||||||
|
/* 修正點:處理 Pager 無障礙朗讀文字 */
|
||||||
|
$('.cycle-slideshow').on('cycle-post-initialize', function(event, optionHash) {
|
||||||
|
var $container = $(this).closest('.w-ba-banner');
|
||||||
|
var $slides = $(this).find('.w-ba-banner__slide');
|
||||||
|
var $pagerButtons = $container.find(".banner-pager button");
|
||||||
|
|
||||||
|
$pagerButtons.each(function(index) {
|
||||||
|
var slideTitle = $slides.eq(index).data('cycle-title') || "";
|
||||||
|
var ariaLabel = "第 " + (index + 1) + " 張投影片 " + slideTitle;
|
||||||
|
$(this).attr({
|
||||||
|
"aria-label": ariaLabel,
|
||||||
|
"title": ariaLabel
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
<style type="text/css">
|
<style type="text/css">
|
||||||
.w-ba-banner .controlplay .resume-slide.active i{
|
.w-ba-banner .controlplay .resume-slide.active i{
|
||||||
|
|
|
||||||
|
|
@ -49,33 +49,41 @@
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<script>
|
<script>
|
||||||
var flag = 1;
|
$('[data-subpart-id="{{subpart-id}}"] .pause-slide').click(function(){
|
||||||
$('.pause-slide').click(function(){
|
$(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle('pause');
|
||||||
$(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle('pause');
|
$(this).addClass('active')
|
||||||
});
|
$(this).parents('.controlplay').eq(0).find('.resume-slide').removeClass('active')
|
||||||
$('.resume-slide').click(function(){
|
|
||||||
$(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle('resume');
|
|
||||||
});
|
|
||||||
$('.next-button').off('click').on('click',function(){
|
|
||||||
$(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle("next");
|
|
||||||
|
|
||||||
})
|
|
||||||
$('.prev-button').off('click').on('click',function(){
|
|
||||||
$(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle("prev");
|
|
||||||
});
|
|
||||||
/* 修正點:處理 Pager 無障礙朗讀文字 */
|
|
||||||
$('.cycle-slideshow').on('cycle-post-initialize', function(event, optionHash) {
|
|
||||||
var $container = $(this).closest('.w-ba-banner');
|
|
||||||
var $slides = $(this).find('.w-ba-banner__slide');
|
|
||||||
var $pagerButtons = $container.find(".banner-pager button");
|
|
||||||
|
|
||||||
$pagerButtons.each(function(index) {
|
|
||||||
var slideTitle = $slides.eq(index).data('cycle-title') || "";
|
|
||||||
var ariaLabel = "第 " + (index + 1) + " 張投影片 " + slideTitle;
|
|
||||||
$(this).attr({
|
|
||||||
"aria-label": ariaLabel,
|
|
||||||
"title": ariaLabel
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
$('[data-subpart-id="{{subpart-id}}"] .resume-slide').click(function(){
|
||||||
|
$(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle('resume');
|
||||||
|
$(this).addClass('active')
|
||||||
|
$(this).parents('.controlplay').eq(0).find('.pause-slide').removeClass('active')
|
||||||
|
});
|
||||||
|
$('[data-subpart-id="{{subpart-id}}"] .next-button').click(function(){
|
||||||
|
$(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle("next");
|
||||||
|
|
||||||
|
})
|
||||||
|
$('[data-subpart-id="{{subpart-id}}"] .prev-button').click(function(){
|
||||||
|
$(this).parent("ul").parent('.w-ba-banner').find(".cycle-slideshow").cycle("prev");
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
<style type="text/css">
|
||||||
|
.w-ba-banner .controlplay .resume-slide.active i{
|
||||||
|
color: #32D9C3;
|
||||||
|
}
|
||||||
|
.w-ba-banner .controlplay .pause-slide.active i{
|
||||||
|
color: #ff4500;
|
||||||
|
}
|
||||||
|
.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;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -17,8 +17,7 @@
|
||||||
<ul class="i-archive-files-list" data-list="files" data-level="2">
|
<ul class="i-archive-files-list" data-list="files" data-level="2">
|
||||||
<li>
|
<li>
|
||||||
<span class="description" style="margin-top: 0.5em;clear: both;widivh: 100%;position: relative;display: block;">{{description}}</span>
|
<span class="description" style="margin-top: 0.5em;clear: both;widivh: 100%;position: relative;display: block;">{{description}}</span>
|
||||||
<a href="{{file-url}}" class="i-archive-files-item" target="{{target}}" title="{{file-name}}">{{file-name}}</a>
|
<a href="{{file-url}}" class="i-archive-files-item" target="{{target}}" title="{{file-name}}">{{file-name}}<span class="label label-primary {{file-type}}">{{file-type}}</span></a>
|
||||||
<span class="label label-primary {{file-type}}">{{file-type}}</span>
|
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -19,8 +19,7 @@
|
||||||
<ul class="i-archive-files-list" data-list="files" data-level="2">
|
<ul class="i-archive-files-list" data-list="files" data-level="2">
|
||||||
<li>
|
<li>
|
||||||
<span class="description" style="margin-top: 0.5em;clear: both;widivh: 100%;position: relative;display: block;">{{description}}</span>
|
<span class="description" style="margin-top: 0.5em;clear: both;widivh: 100%;position: relative;display: block;">{{description}}</span>
|
||||||
<a href="{{file-url}}" class="i-archive-files-item" target="{{target}}" title="{{file-name}}">{{file-name}}</a>
|
<a href="{{file-url}}" class="i-archive-files-item" target="{{target}}" title="{{file-name}}">{{file-name}}<span class="label label-primary {{file-type}}">{{file-type}}</span></a>
|
||||||
<span class="label label-primary {{file-type}}">{{file-type}}</span>
|
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@
|
||||||
<div class="i-member-item-inner clearfix">
|
<div class="i-member-item-inner clearfix">
|
||||||
<div class="i-member-pic-wrap col-sm-4 col-xs-4">
|
<div class="i-member-pic-wrap col-sm-4 col-xs-4">
|
||||||
<a href="{{link_to_show}}" title="{{name}}">
|
<a href="{{link_to_show}}" title="{{name}}">
|
||||||
<img class="i-member-pic" src="{{image}}" title="{{name}}">
|
<img class="i-member-pic" src="{{image}}" alt="{{name}}">
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="i-member-profile-data-wrap col-sm-8 col-xs-8">
|
<div class="i-member-profile-data-wrap col-sm-8 col-xs-8">
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@
|
||||||
<div class="i-member-item-inner clearfix">
|
<div class="i-member-item-inner clearfix">
|
||||||
<div class="i-member-pic-wrap">
|
<div class="i-member-pic-wrap">
|
||||||
<a href="{{link_to_show}}" title="{{name}}">
|
<a href="{{link_to_show}}" title="{{name}}">
|
||||||
<img class="i-member-pic" src="{{image}}" title="{{name}}">
|
<img class="i-member-pic" src="{{image}}" alt="{{name}}">
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="i-member-profile-data-wrap">
|
<div class="i-member-profile-data-wrap">
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@
|
||||||
<div class="i-member-item-inner clearfix">
|
<div class="i-member-item-inner clearfix">
|
||||||
<div class="i-member-pic-wrap">
|
<div class="i-member-pic-wrap">
|
||||||
<a href="{{link_to_show}}" title="{{name}}">
|
<a href="{{link_to_show}}" title="{{name}}">
|
||||||
<img class="i-member-pic" src="{{image}}" title="{{name}}">
|
<img class="i-member-pic" src="{{image}}" alt="{{name}}">
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="i-member-profile-data-wrap">
|
<div class="i-member-profile-data-wrap">
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@
|
||||||
<div class="i-member-item-inner clearfix">
|
<div class="i-member-item-inner clearfix">
|
||||||
<div class="i-member-pic-wrap">
|
<div class="i-member-pic-wrap">
|
||||||
<a href="{{link_to_show}}" title="{{name}}">
|
<a href="{{link_to_show}}" title="{{name}}">
|
||||||
<img class="i-member-pic" src="{{image}}" title="{{name}}">
|
<img class="i-member-pic" src="{{image}}" alt="{{name}}">
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
<li class="widget-content">
|
<li class="widget-content">
|
||||||
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
||||||
<div class="link-img-wrap{{display_image}}">
|
<div class="link-img-wrap{{display_image}}">
|
||||||
<img src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
<img src="{{img_src}}" alt="{{img_description}}">
|
||||||
</div>
|
</div>
|
||||||
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">{{title}}</a>
|
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">{{title}}</a>
|
||||||
<span data-list="statuses" data-level="1">
|
<span data-list="statuses" data-level="1">
|
||||||
|
|
|
||||||
|
|
@ -5,11 +5,11 @@
|
||||||
<ul class="list-unstyled" data-level="0" data-list="web_link">
|
<ul class="list-unstyled" data-level="0" data-list="web_link">
|
||||||
<li class="widget-content widget-content-horizontal col-sm-3">
|
<li class="widget-content widget-content-horizontal col-sm-3">
|
||||||
<div class="widget-content2">
|
<div class="widget-content2">
|
||||||
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}" class="widget-img">
|
<div class="widget-img">
|
||||||
<div class="link-img-wrap{{display_image}}">
|
<div class="link-img-wrap{{display_image}}">
|
||||||
<img src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
<img src="{{img_src}}" alt="{{img_description}}" >
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</div>
|
||||||
|
|
||||||
<a class="widget-content-title" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
<a class="widget-content-title" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
||||||
<span class="" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">{{title}}</span>
|
<span class="" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">{{title}}</span>
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
<li class="widget-content widget-content-horizontal col-sm-3">
|
<li class="widget-content widget-content-horizontal col-sm-3">
|
||||||
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
||||||
<div class="link-img-wrap{{display_image}}">
|
<div class="link-img-wrap{{display_image}}">
|
||||||
<img src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
<img src="{{img_src}}" alt="{{img_description}}">
|
||||||
</div>
|
</div>
|
||||||
<div class="widget-content-title">
|
<div class="widget-content-title">
|
||||||
<span class="" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">{{title}}</span>
|
<span class="" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">{{title}}</span>
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
<li class="widget-content widget-content-horizontal ">
|
<li class="widget-content widget-content-horizontal ">
|
||||||
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
||||||
<div class="link-img-wrap{{display_image}}">
|
<div class="link-img-wrap{{display_image}}">
|
||||||
<img src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
<img src="{{img_src}}" alt="{{img_description}}">
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
<div class="widget-content-title">
|
<div class="widget-content-title">
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
<li class="widget-content widget-content-horizontal col-sm-6">
|
<li class="widget-content widget-content-horizontal col-sm-6">
|
||||||
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
||||||
<div class="link-img-wrap{{display_image}}">
|
<div class="link-img-wrap{{display_image}}">
|
||||||
<img src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
<img src="{{img_src}}" alt="{{img_description}}">
|
||||||
</div>
|
</div>
|
||||||
<div class="widget-content-title">
|
<div class="widget-content-title">
|
||||||
<a class="" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">{{title}}</a>
|
<a class="" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">{{title}}</a>
|
||||||
|
|
|
||||||
|
|
@ -7,9 +7,9 @@
|
||||||
<div class="hex-border">
|
<div class="hex-border">
|
||||||
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
||||||
<div class="link-img-wrap{{display_image}}">
|
<div class="link-img-wrap{{display_image}}">
|
||||||
<img src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
<img src="{{img_src}}" alt="{{img_description}}">
|
||||||
</div>
|
</div>
|
||||||
<a class="widget-content-title" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">{{title}}</a>
|
<a class="widget-content-title" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}" onclick="{{onclick}}">{{title}}</a>
|
||||||
<span data-list="statuses" data-level="1">
|
<span data-list="statuses" data-level="1">
|
||||||
<span class="label status {{status-class}}">{{status}}</span>
|
<span class="label status {{status-class}}">{{status}}</span>
|
||||||
</span>
|
</span>
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
<li class="index-content">
|
<li class="index-content">
|
||||||
<a class="index-content-title" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
<a class="index-content-title" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
||||||
<div class="link-img-wrap{{display_image}}">
|
<div class="link-img-wrap{{display_image}}">
|
||||||
<img src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
<img src="{{img_src}}" alt="{{img_description}}">
|
||||||
</div>
|
</div>
|
||||||
<h4>
|
<h4>
|
||||||
{{title}}
|
{{title}}
|
||||||
|
|
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
<li class="index-content col-md-4 col-sm-4">
|
<li class="index-content col-md-4 col-sm-4">
|
||||||
<a class="index-content-title" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
<a class="index-content-title" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
|
||||||
<div class="link-img-wrap{{display_image}}">
|
<div class="link-img-wrap{{display_image}}">
|
||||||
<img src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
|
<img src="{{img_src}}" alt="{{img_description}}">
|
||||||
</div>
|
</div>
|
||||||
<h4>
|
<h4>
|
||||||
<span class="link-title">
|
<span class="link-title">
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue