This commit is contained in:
ken 2026-07-06 12:40:54 +08:00
parent 8ffc18f30b
commit 60b590a25e
12 changed files with 197 additions and 21 deletions

View File

@ -291,9 +291,19 @@
// 無障礙:聚焦第一個互動元素
if ($('.mobile-menu').hasClass('active')) {
setTimeout(function () {
$('.modules-menu').find('input, button, select, textarea, a').first().focus();
}, 100);
var $target = $($('.navbar-toggle').first().attr('data-bs-target'));
if ($target.length) {
// 有 Bootstrap collapse → 等展開動畫完成再 focus
$target.one('shown.bs.collapse', function() {
$('.modules-menu').find('input, button, select, textarea, a').filter(':visible').first().focus();
});
} else {
// 無 Bootstrap collapse → 直接 setTimeout
setTimeout(function() {
$('.modules-menu').find('input, button, select, textarea, a').filter(':visible').first().focus();
}, 100);
}
}
});
@ -2414,7 +2424,63 @@ $(document).ready(function() {
init();
});
//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);
});
//orbitbar無障礙js
$(document).ready(function() {
const isEnglish = document.documentElement.lang === 'en';
@ -3022,6 +3088,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') {
@ -3161,5 +3230,34 @@ $(document).ready(function () {
fixSearchInputA11y();
}, 500);
});
//a無障礙空連結
function removeHiddenContentLinks() {
// 若網址含有 editmode=on 則不執行
if (window.location.href.indexOf('editmode=on') !== -1) return;
$('a').each(function () {
var $link = $(this);
// 若連結本身是 display:none直接移除
if ($link.css('display') === 'none') {
$link.remove();
return;
}
// 若連結內有子元素,且全部都是 display:none
var $children = $link.children();
if ($children.length > 0) {
var allHidden = $children.toArray().every(function (child) {
return $(child).css('display') === 'none';
});
if (allHidden) {
$link.remove();
}
}
});
}
$(document).ready(function () {
setTimeout(removeHiddenContentLinks, 500);
});
}(jQuery, window));

View File

@ -2,12 +2,60 @@
@import "../initial";
@import "variables";
.fa-classic, .fa-regular, .fa-solid, .far, .fas ,.fa{
font-family: var(--fa-style-family, "FontAwesome")!important;
}
#orbit-bar .orbit-bar-inner > label:focus, #orbit-bar .orbit-bar-inner > label.focus{
.orbit-bar-search-sign-language{
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;
transition: all 0.2s ease-in-out!important;
}
.orbit-bar-inner{
li.active {
@media(min-width:768px){
padding: 0 !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;
display: inline-block!important;
line-height: 40px;
float: left;
@media(min-width:769px){
color: #fff!important;
}
}
[accesskey="W"]{
height: 40px;
display: inline-block!important;
line-height: 40px;
float: left;
color: #fff!important;
@media(min-width:769px){
color: #fff!important;
}
}
}
.orbit-bar-search-sign-language{
@media(max-width:767px){
position: absolute !important;
@ -19,12 +67,12 @@
}
body #orbit-bar .orbit-bar-search-sign-language #search input[type="search"]{
&:hover{
outline: 3px solid $theme-color-third;
outline: 3px solid $theme-color-second;
background-color: #e6f0ff;
border-radius: 4px;
}
&:focus{
outline: 3px solid $theme-color-third;
outline: 3px solid $theme-color-second;
background-color: #e6f0ff;
border-radius: 4px;
}

View File

@ -2,7 +2,6 @@
<div class="container layout-footer-inner">
<div class="layout-footer-content">{{footer-data}}</div>
<div class="footer-counter"><a href="https://orbitek.co"><img src="/assets/orbitek.png" alt="orbitek-logo-icon" style="width: 15px;"></a>{{site-counter}}</div>
<div class="footer-updated-date">{{last-updated}}</div>
</div>
</footer>

View File

@ -76,6 +76,14 @@
$caption.after($controlplay);
}, 500);
$('.ba-banner-widget-0 .w-ad-banner__slide a')
.on('focus', function() {
$('.ba-banner-widget-0 img').css('position', 'relative');
})
.on('blur', function() {
$('.ba-banner-widget-0 img').css('position', '');
});
});
</script>
<style type="text/css">
@ -91,4 +99,27 @@
.next-button,.prev-button{
cursor: pointer;
}
/* ✅ 焦點可見樣式 */
.w-ba-banner .w-ba-banner__slide a:focus,
.w-ba-banner .w-ba-banner__slide a:focus-visible {
outline: 3px solid #005fcc;
outline-offset: 2px;
}
.w-ba-banner .prev-button:focus,
.w-ba-banner .prev-button:focus-visible,
.w-ba-banner .next-button:focus,
.w-ba-banner .next-button:focus-visible {
outline: 3px solid #005fcc;
outline-offset: 2px;
}
.w-ba-banner .controlplay a:focus,
.w-ba-banner .controlplay a:focus-visible {
outline: 3px solid #005fcc;
outline-offset: 2px;
}
.w-ba-banner .banner-pager button:focus,
.w-ba-banner .banner-pager button:focus-visible {
outline: 3px solid #005fcc;
outline-offset: 2px;
}
</style>

View File

@ -6,7 +6,7 @@
<div class="index-content">
<div class="index-content-inner clearfix row">
<div class="index-pic col-xs-5 col-sm-2">
<img class="index-img" src="{{thumb-src}}" alt="{{alt_title}}">
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{album-name}}">
</div>
<section class="index-part col-xs-7 col-sm-10">
<h4 class="index-content-title">

View File

@ -6,7 +6,7 @@
<div class="index-content">
<div class="index-content-inner clearfix row">
<div class="index-pic col-xs-5 col-sm-2">
<img class="index-img" src="{{thumb-src}}" alt="{{alt_title}}">
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{album-name}}">
</div>
<section class="index-part col-xs-7 col-sm-10">
<h4 class="index-content-title">

View File

@ -10,7 +10,7 @@
{{thumb-large-src}} 1024w,
{{thumb-src}} 768w"
src="{{thumb-src}}"
alt="{{alt_title}}"
alt="{{album-name}}"
>
</a>
<a href="{{link_to_show}}" title="{{album-name}}">

View File

@ -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}}" title="{{album-name}}">
<div class="index-pic col-xs-5 col-sm-2">
<img class="index-img" src="{{thumb-src}}" alt="{{alt_title}}">
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{album-name}}">
</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}}" title="{{album-name}}">{{album-name}}</a>
</h4>
<div class="index-img-description">{{album-description}}</div>
</div>

View File

@ -4,7 +4,7 @@
</h2>
<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}}" title="{{album-name}}">
<div class="index-content-inner">
<div class="index-pic">
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{alt_title}}">
@ -12,7 +12,7 @@
</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>
</div>

View File

@ -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}}" title="{{album-name}}">
<div class="index-pic col-xs-5 col-sm-2">
<img class="index-img" src="{{thumb-src}}" alt="{{alt_title}}">
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{album-name}}">
</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}}" title="{{album-name}}">{{album-name}}</a>
</h4>
</div>

View File

@ -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}}" 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}}" title="{{album-name}}">
<h3 class="card-title">{{album-name}}</h3>
</a>
</div>

View File

@ -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}}" title="{{album-name}}">
<div class="index-pic">
<img class="img-thumbnail" src="{{thumb-src}}" alt="{{alt_title}}">
</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}}" title="{{album-name}}">{{album-name}}</a>
</h4>
</section>
</div>