Fix accessibility.

This commit is contained in:
rulingcom 2023-07-08 16:55:36 +08:00
parent cbee590a08
commit fc246a4961
3 changed files with 66 additions and 54 deletions

View File

@ -48,6 +48,31 @@
}
window.already_fix_first_element = true;
}
function open_kenjoh(flag){
if(flag){
if (parseInt($('.layout-content').css('margin-top'))==0 && $('.layout-content.topcontent').length != 0 && $('.layout-content.topcontent').offset().top<400){
$('.layout-content').css('margin-top',$('.kenjohn').height()-$('#orbit-bar').height());
}
$('.kenjohn').addClass('navFixed').removeClass('navRel'); /* 幫選單加上固定效果 */
}else{
if ($('.header-banner').html().trim() == "") {
$('.kenjohn').removeClass('navFixed').addClass('navRel');
}else{
$('.kenjohn').removeClass('navRel').removeClass('navFixed'); /* 移除選單固定效果 */
}
$('.layout-content').css('margin-top','');
}
}
function recalc_kenjohn_header(){
$('.layout-header').css('height', '');
var scrollTop = $(window).scrollTop();
var scrollBottom = $('html').height() - $(window).height() - $('.kenjohn').height();
if (scrollTop>5 && scrollBottom>0) { /* 要滑動到選單的距離 */
open_kenjoh(true);
} else {
open_kenjoh(false);
}
}
function initdata1 () {
window.temp_scrollY = window.pageYOffset;
window.temp_scrollX = window.pageXOffset;
@ -57,19 +82,7 @@
}
// if (location.href.search('editmode') == -1 && document.getElementsByClassName('asideright').length != 0) {
if ( $('.header-banner').length != 0) {
$('.layout-header').css('height', '');
var scrollTop = $(window).scrollTop();
if (!window.has_topest_banner){
$('.kenjohn').removeClass('navRel').addClass('navFixed'); /* 正常選單固定效果 */
}else if (scrollTop>5) { /* 要滑動到選單的距離 */
if (parseInt($('.layout-content').css('margin-top'))==0 && $('.layout-content.topcontent').length != 0 && $('.layout-content.topcontent').offset().top<400){
$('.layout-content').css('margin-top',$('.kenjohn').height()-$('#orbit-bar').height());
}
$('.kenjohn').addClass('navFixed').removeClass('navRel'); /* 幫選單加上固定效果 */
} else {
$('.kenjohn').removeClass('navRel').removeClass('navFixed'); /* 移除選單固定效果 */
$('.layout-content').css('margin-top','');
}
recalc_kenjohn_header();
}
var navFixed = $('.kenjohn.navFixed');
window.top_barrier_height = (navFixed.length ? navFixed.height() : 0) + $('#orbit-bar').height();
@ -706,6 +719,31 @@ function transdate(){
window.temp_scrollX = document.documentElement.scrollLeft;
}
if(!isMobile){
$('.orbit-bar-search-sign-language .logout-btn:eq(-1), #loginbutton').on('focusout', function(){
if(window.is_press_tab){
console.log('open')
open_kenjoh(true);
$('#accesskey_top').focus();
}
})
$('#gotocenter').on('focusout', function(){
recalc_kenjohn_header();
})
$('.kenjohn a').eq(-1).on('focusout', function(){
if(window.is_press_tab){
recalc_kenjohn_header();
}
})
$('#accesskey_top').on('focusout', function(){
if(window.is_press_shift_tab){
recalc_kenjohn_header();
}
})
$(document).on('click', '#accesskey_top, #accesskey_menu', function(e){
e.preventDefault();
open_kenjoh(true);
$(this).focus();
})
$(document).on('focusin','*',function(event){
// event.stopPropagation();
if(window.focus_timeout_id){
@ -732,7 +770,6 @@ function transdate(){
}, 800);
if ($('header>.kenjohn').attr('class') == "kenjohn" && _this.is('a.orbit-bar-logo')){
$('header>.kenjohn').addClass('navRel');
$('#gotocenter').focus();
}
}
});

View File

@ -35,7 +35,7 @@ body{
box-sizing: border-box;
}
a:hover span {
a:focus span, a:hover span {
width: 60px;
height: 60px;
margin-left: -30px;
@ -44,7 +44,7 @@ body{
border-color: #facf3d;
}
}
.downIcon a:hover span::after {
.downIcon a:focus span::after, .downIcon a:hover span::after {
width: 21px;
height: 21px;
border-left-width: 4px;

View File

@ -245,6 +245,7 @@ a#content{
color: $theme-color-main;
font-size: 0.6em;
font-family: $main-font;
height: auto;
@media (max-width: $screen-sm) {
height: 5em;
display: none;
@ -260,44 +261,18 @@ a#content{
width:100%!important;
}
@media(min-width:1900px){
width: 225px;
margin-top: -12px;
width: 330px;
}
@media screen and (min-width:1025px) and (max-width:1899px){
width: 181px;
margin-top: -3px;
width: 261px;
}
@media screen and (min-width:769px) and (max-width:1025px){
width: 150px;
margin-top: -5px;
}
@media screen and (min-width:$screen-xs) and (max-width:769px){
width: 146px !important;
}
@media screen and (max-width:$screen-xs){
width: 110px !important;
margin-top: 3px;
}
}
.navbar-brand:nth-child(2){
@media(min-width:1900px){
width: 330px!important;
margin-top: -14px;
}
@media screen and (min-width:1025px) and (max-width:1899px){
width: 261px!important;
margin-top: -5px;
}
@media screen and (min-width:769px) and (max-width:1025px){
width: 200px!important;
}
@media screen and (min-width:$screen-xs) and (max-width:769px){
width: 200px!important;
@media screen and (min-width:$screen-xs) and (max-width:1025px){
width: 200px;
}
@media screen and (max-width:$screen-xs){
width: 150px !important;
}
}
}
}