This commit is contained in:
ken 2026-08-10 13:53:54 +08:00
parent c9dd182ee2
commit 14a93d4149
21 changed files with 233 additions and 113 deletions

View File

@ -292,80 +292,103 @@ $(function() {
}
},
ClickMenuHandler: function() {
// 處理主選單切換(漢堡 icon
$(document).on('click', '.navbar-toggle', function (e) {
e.preventDefault();
ClickMenuHandler: function() {
// 處理主選單切換(漢堡 icon
$(document).on('click', '.navbar-toggle', function (e) {
e.preventDefault();
// 確保 .navbar-toggle 放到 .modules-menu 後面
$('.mobile-menu').each(function () {
var $menu = $(this);
if ($menu.find('.modules-menu').length && !$menu.find('.modules-menu + .navbar-toggle').length) {
$menu.find('.modules-menu').after($menu.find('.navbar-toggle'));
// 確保 .navbar-toggle 放到 .modules-menu 後面
$('.mobile-menu').each(function () {
var $menu = $(this);
if ($menu.find('.modules-menu').length && !$menu.find('.modules-menu + .navbar-toggle').length) {
$menu.find('.modules-menu').after($menu.find('.navbar-toggle'));
}
});
$('.mobile-menu').toggleClass('active');
$('body').toggleClass('noscroll');
// ★ 修正:依據 active 狀態決定 collapsed 的加/移除
if ($('.mobile-menu').hasClass('active')) {
$('.mobile-menu .navbar-toggle').removeClass('collapsed'); // 打開 → 叉叉
} else {
$('.mobile-menu .navbar-toggle').addClass('collapsed'); // 關閉 → 三條橫線
}
// 關閉所有下拉選單
$('.mobile-menu1 > ul, .mobile-menu2 > ul').slideUp(500);
$('.mobile-menu1 > .menu-drop, .mobile-menu2 > .menu-drop').removeClass('opened');
// 無障礙:聚焦第一個互動元素
if ($('.mobile-menu').hasClass('active')) {
setTimeout(function () {
$('.modules-menu').find('input, button, select, textarea, a').first().focus();
}, 100);
}
});
$('.mobile-menu').toggleClass('active');
$('body').toggleClass('noscroll');
$('.mobile-menu .navbar-toggle').removeClass('collapsed');
// 關閉所有下拉選單
$('.mobile-menu1 > ul, .mobile-menu2 > ul').slideUp(500);
$('.mobile-menu1 > .menu-drop, .mobile-menu2 > .menu-drop').removeClass('opened');
// 無障礙:聚焦第一個互動元素
if ($('.mobile-menu').hasClass('active')) {
setTimeout(function () {
$('.modules-menu').find('input, button, select, textarea, a').first().focus();
}, 100);
}
});
// ✅ Tab 鍵跳過 .navbar-toggle 時,觸發與點擊相同的收合邏輯
$(document).on('focusout', '.mobile-menu', function(e) {
// ✅ Tab 鍵跳過 .mobile-menu 時,觸發收合邏輯
$(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');
var $newFocus = $(document.activeElement);
// 焦點在 body 時代表滑鼠正在點擊中,不處理
if ($newFocus.is('body')) return;
if ($('.mobile-menu').hasClass('active') && $newFocus.closest('.mobile-menu').length === 0) {
var $btn = $('.navbar-toggle').first();
if ($btn.attr('data-bs-toggle')) {
var target = $btn.attr('data-bs-target');
var bsCollapse = window.bootstrap && bootstrap.Collapse.getInstance($(target)[0]);
if (bsCollapse) bsCollapse.hide();
$('.mobile-menu').removeClass('active');
$('body').removeClass('noscroll');
$('.mobile-menu .navbar-toggle').addClass('collapsed');
$('.mobile-menu1 > ul, .mobile-menu2 > ul').slideUp(500);
$('.mobile-menu1 > .menu-drop, .mobile-menu2 > .menu-drop').removeClass('opened');
} else {
$btn.trigger('click');
}
}
}, 50);
});
});
$('.mobile-menu1 > .menu-drop').click(function(){
var $that = $(this);
var opencheck1 = $that.hasClass('opened');
if ( opencheck1 == 0 ) {
$('.mobile-menu1 > ul').not($that.siblings('ul')).slideUp(500);
$('.mobile-menu1 > .menu-drop').not($that).removeClass('opened');
$('.mobile-menu2 > ul').slideUp(500);
$('.mobile-menu2 > .menu-drop').removeClass('opened');
$that.siblings('ul').slideDown(500);
$that.addClass('opened');
$('.mobile-menu1 > .menu-drop').click(function(){
var $that = $(this);
var opencheck1 = $that.hasClass('opened');
if ( opencheck1 == 0 ) {
$('.mobile-menu1 > ul').not($that.siblings('ul')).slideUp(500);
$('.mobile-menu1 > .menu-drop').not($that).removeClass('opened');
$('.mobile-menu2 > ul').slideUp(500);
$('.mobile-menu2 > .menu-drop').removeClass('opened');
$that.siblings('ul').slideDown(500);
$that.addClass('opened');
} else if (opencheck1 == 1) {
$that.siblings('ul').slideUp(500);
$('.mobile-menu2 > ul').slideUp(500);
$('.mobile-menu2 > .menu-drop').removeClass('opened');
$that.removeClass('opened');
} else if (opencheck1 == 1) {
$that.siblings('ul').slideUp(500);
$('.mobile-menu2 > ul').slideUp(500);
$('.mobile-menu2 > .menu-drop').removeClass('opened');
$that.removeClass('opened');
}
})
}
})
$('.mobile-menu2 > .menu-drop').click(function(){
var $that = $(this);
var opencheck2 = $that.hasClass('opened');
if ( opencheck2 == 0 ) {
$('.mobile-menu2 > ul').not($that.siblings('ul')).slideUp(500);
$('.mobile-menu2 > .menu-drop').not($that).removeClass('opened');
$that.siblings('ul').slideDown(500);
$that.addClass('opened');
} else if (opencheck2 == 1) {
$that.siblings('ul').slideUp(500);
$that.removeClass('opened');
}
})
}
$('.mobile-menu2 > .menu-drop').click(function(){
var $that = $(this);
var opencheck2 = $that.hasClass('opened');
if ( opencheck2 == 0 ) {
$('.mobile-menu2 > ul').not($that.siblings('ul')).slideUp(500);
$('.mobile-menu2 > .menu-drop').not($that).removeClass('opened');
$that.siblings('ul').slideDown(500);
$that.addClass('opened');
} else if (opencheck2 == 1) {
$that.siblings('ul').slideUp(500);
$that.removeClass('opened');
}
})
}
};
// 把orbit物件加到window物件裡面並改名為ORBITFRONT來減少名稱衝突的機會
@ -2185,7 +2208,7 @@ $(document).ready(function() {
if ($(window).width() <769) {
$('.modules-menu-level-0').after($('.header-nav'));
}else{
$('.navbar-header').before($('.header-nav'));
$('.navbar-header').after($('.header-nav'));
};
$('.sitemenu-vertical .sitemenu-dropdown-toggle').click(function(){
$('.sitemenu-vertical .dropdown-menu').slideToggle();
@ -2253,7 +2276,7 @@ $(document).ready(function() {
$('.modules-menu-level-0').after($('.header-nav'));
}else{
$('.navbar-header').before($('.header-nav'));
$('.navbar-header').after($('.header-nav'));
};
if ($(window).width() > 821) {
@ -2748,6 +2771,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') {
@ -2882,6 +2908,96 @@ $(document).ready(function () {
fixSortLinkA11y();
fixSearchInputA11y();
}, 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>');
}
});
});
// 執行 member等高計算目前改用flexbox故mark掉 by ika 20160105
// $(window).load(function() {

View File

@ -3,7 +3,7 @@
a[accesskey] {
position: absolute;
margin-left: -0.9375em;
color: transparent !important;
color: #fff !important;
background: transparent !important;
border: 0 !important;
}

View File

@ -4,7 +4,7 @@
@import "variables";
.fa-classic, .fa-regular, .fa-solid, .far, .fas ,.fa{
font-family: var(--fa-style-family, "FontAwesome");
font-family: "FontAwesome";
}
#orbit-bar .orbit-bar-inner > label:focus, #orbit-bar .orbit-bar-inner > label.focus{
.orbit-bar-search-sign-language{
@ -26,16 +26,16 @@
}
}
}
label[for="open-orbit-login"] {
@media(max-width:768px){
display: none!important;
}
}
[accesskey="U"],[accesskey="W"]{
@media(max-width:768px){
color: #666!important;
}
}
// label[for="open-orbit-login"] {
// @media(max-width:768px){
// display: none!important;
// }
// }
// [accesskey="U"],[accesskey="W"]{
// @media(max-width:768px){
// color: #666!important;
// }
// }
.orbit-bar-inner{
[accesskey="U"]{
height: 40px;

View File

@ -15,10 +15,9 @@
font-size: 0.750em;
border-radius: 0.125em;
z-index: 1050;
opacity: .7;
&:hover {
background:$theme-color-second;
background:#094b67;
opacity:1;
}
}

View File

@ -1,6 +1,11 @@
@charset "utf-8";
@import "../initial";
.line-it-button{
.label{
color: #333!important;
}
}
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9{
@media(max-width: $screen-xs){
padding: 0;
@ -308,7 +313,7 @@
--wp--preset--color--pale-cyan-blue: #8ed1fc;
--wp--preset--color--vivid-cyan-blue: #0693e3;
--wp--preset--color--vivid-purple: #9b51e0;
--wp--preset--color--vk-color-custom-1: #35933a;
--wp--preset--color--vk-color-custom-1: #17691b;
--wp--preset--color--vk-color-custom-2: #4e7a4e;
--wp--preset--color--vk-color-custom-3: #7e8f63;
--wp--preset--color--vk-color-custom-4: #cbe1cb;

View File

@ -131,9 +131,6 @@
margin-top: 1em!important;
margin-bottom: 1em!important;
}
@media (min-width: 769px){
float: none!important;
}
// @media (max-width: $screen-sm) {
// width: 100%;
// display: flex;

View File

@ -30,9 +30,11 @@ ul.button-mid{
}
}
}
ul.button-mid{
margin:0;
z-index: 201;
.button-mid {
position: absolute;
width: 100%;
height: 0;
top: 50%;
}
.banner-pager .active-slide button{
background: $theme-color-second!important;

View File

@ -2599,12 +2599,6 @@
.i-annc__entry-title {
margin-bottom: 0;
margin-top: 0;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
// clear: both;
}
.i-annc__title {
@ -2612,6 +2606,11 @@
color: $theme-color-main;
text-decoration: none;
@extend .i-title;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
overflow: hidden;
&:hover {
color: $theme-color-second;
}

View File

@ -21,11 +21,8 @@
<div class="outdropdowns kenjohn">
<div class="dropdowns">
<div class="header-nav container no-print">
<a id="accesskey_top" accesskey="U" title="accesskey top" href="#" title="Toolbar">:::</a>
{{header-data}}
</div>
<div class="container navbar-header">
<div class="container ">
<div class="navbar-header">
<a title="{{site_title_1}}" class="navbar-brand" href="{{home_link_1}}"><img class="site-logo" src="{{logo_url_1}}" alt="site-logo"></a>
<script>$(document).ready(function(){var url =$('.site-logo').eq(0).attr('src');if(url == "/assets/default-site-logo.png"){$('.navbar-brand').eq(0).remove();};if($('.navbar-brand').length == 2){$('.site-logo').css('height','auto')};$('.site-logo').eq(0).css('margin-right',0);$('.navbar-brand').css('padding-right',0)})</script>
<a title="{{site_title}}" class="navbar-brand" href="{{home_link}}"><img class="site-logo" src="{{logo_url}}" alt="site-logo"> {{site_name}}</a>
@ -35,7 +32,12 @@
<span class="icon-bar icon-bar-middle"></span>
<span class="icon-bar icon-bar-bottom"></span>
</button>
</div>
</div>
<div class="header-nav no-print">
<a id="accesskey_top" accesskey="U" title="accesskey top" href="#" title="Toolbar">:::</a>
{{header-data}}
</div>
</div>
<div class="collapse navbar-collapse modules-menu" id="layout-navigation">
<a id="accesskey_menu" title="accesskey menu" accesskey="M" href="#" title="Main menu">:::</a>

View File

@ -29,7 +29,9 @@
</div>
</div>
<ul class="w-ba-banner__pager-2 banner-pager banner_caption_{{subpart-id}}"></ul>
<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="播放控制選項">
<a role="radio" aria-checked="true" href="javascript:;" class="resume-slide active" title="繼續播放" aria-label="繼續播放" aria-live="assertive">
<i aria-hidden="true"></i>

View File

@ -17,8 +17,7 @@
<dl class="i-archive__file-list" data-list="files" data-level="2">
<dd class="i-archive__file-wrap">
<i class="fa-solid fa-file"></i>
<a class="i-archive__file-name" href="{{file-url}}" target="{{target}}" title="{{file-name}}">{{file-name}}</a>
<span class="i-archive__file-type label label-primary {{file-type}}">{{file-type}}</span>
<a class="i-archive__file-name" href="{{file-url}}" target="{{target}}" title="{{file-name}}">{{file-name}}<span class="i-archive__file-type label label-primary {{file-type}}">{{file-type}}</span></a>
</dd>
</dl>
</div>

View File

@ -18,8 +18,7 @@
<div class="panel-body">
<ul class="i-archive-files-list" data-list="files" data-level="2">
<li>
<a href="{{file-url}}" class="i-archive-files-item" target="{{target}}" title="{{file-name}}">{{file-name}}</a>
<span class="label label-primary {{file-type}}">{{file-type}}</span>
<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>
</li>
</ul>
</div>

View File

@ -6,7 +6,7 @@
<li class="widget-content">
<div class="link-img-wrap{{display_image}}">
<a href="{{link_to_show}}" target="{{target}}" title="{{img_description}}">
<img src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
<img src="{{img_src}}" alt="{{img_description}}">
</a>
</div>
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">{{title}}</a>

View File

@ -6,7 +6,7 @@
<li class="widget-content">
<div class="link-img-wrap{{display_image}}">
<a href="{{link_to_show}}" target="{{target}}" title="{{img_description}}">
<img src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
<img src="{{img_src}}" alt="{{img_description}}">
</a>
</div>
<span data-list="statuses" data-level="1">

View File

@ -6,7 +6,7 @@
<li class="widget-content">
<div class="link-img-wrap{{display_image}}">
<a href="{{link_to_show}}" target="{{target}}" title="{{img_description}}">
<img src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
<img src="{{img_src}}" alt="{{img_description}}">
</a>
</div>
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">{{title}}</a>

View File

@ -7,7 +7,7 @@
<div class="link-img-wrap{{display_image}}">
<a href="{{link_to_show}}" target="{{target}}" title="{{img_description}}">
<img src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
<img src="{{img_src}}" alt="{{img_description}}">
</a>
</div>
<div class="widget-content-title">

View File

@ -6,7 +6,7 @@
<li class="widget-content widget-content-horizontal ">
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
<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>
</a>
<div class="widget-content-title">

View File

@ -6,7 +6,7 @@
<li class="widget-content widget-content-horizontal col-sm-6">
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
<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 class="widget-content-title">
<a class="" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">{{title}}</a>

View File

@ -7,9 +7,9 @@
<div class="hex-border">
<a href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
<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>
<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 class="label status {{status-class}}">{{status}}</span>
</span>

View File

@ -6,7 +6,7 @@
<li class="index-content">
<a class="index-content-title" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
<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>
<h4>
{{title}}

View File

@ -6,7 +6,7 @@
<li class="index-content col-md-4 col-sm-4">
<a class="index-content-title" href="{{link_to_show}}" target="{{target}}" title="{{title_text}}">
<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>
<h4>
<span class="link-title">