Updated. Fix accessibility.

This commit is contained in:
rulingcom 2022-08-24 19:14:22 +08:00
parent cf3acd4f15
commit 15fbcd8a53
7 changed files with 118 additions and 27 deletions

View File

@ -12,6 +12,12 @@
} }
}); });
function initdata1 () { function initdata1 () {
window.temp_scrollY = window.pageYOffset;
window.temp_scrollX = window.pageXOffset;
if(window.temp_scrollY == undefined){
window.temp_scrollY = document.documentElement.scrollTop;
window.temp_scrollX = document.documentElement.scrollLeft;
}
if ($('.header-banner').html().trim() == "") { if ($('.header-banner').html().trim() == "") {
$('.downIcon').css('display','none') $('.downIcon').css('display','none')
} }
@ -34,10 +40,14 @@
$('.layout-content').css('margin-top',''); $('.layout-content').css('margin-top','');
} }
} }
var navFixed = $('.kenjohn.navFixed');
window.top_barrier_height = (navFixed.length ? navFixed.height() : 0) + $('#orbit-bar').height();
} }
// 初始函數: 把所有的程式碼都包在init裡面方便在之後的jQuery ready 函數裡一次呼叫 // 初始函數: 把所有的程式碼都包在init裡面方便在之後的jQuery ready 函數裡一次呼叫
function init() { function init() {
// 快取一些常用的變數 // 快取一些常用的變數
var navFixed = $('.kenjohn.navFixed');
window.top_barrier_height = (navFixed.length ? navFixed.height() : 0) + $('#orbit-bar').height();
var doc = document; var doc = document;
var lang = doc.documentElement.lang; var lang = doc.documentElement.lang;
var pageModule = doc.body.getAttribute('data-module'); var pageModule = doc.body.getAttribute('data-module');
@ -451,6 +461,8 @@
// 自適應網頁使用當使用者改變瀏覽器寬度時呼叫orbit.nav.setDropdown函數 // 自適應網頁使用當使用者改變瀏覽器寬度時呼叫orbit.nav.setDropdown函數
$(window).resize(function() { $(window).resize(function() {
var navFixed = $('.kenjohn.navFixed');
window.top_barrier_height = (navFixed.length ? navFixed.height() : 0) + $('#orbit-bar').height();
if ($(window).outerWidth() < 769) { if ($(window).outerWidth() < 769) {
if (resizeTimer) clearTimeout(resizeTimer); if (resizeTimer) clearTimeout(resizeTimer);
$('.outdropdowns').before($('.header-nav')); $('.outdropdowns').before($('.header-nav'));
@ -728,8 +740,23 @@ function transdate(){
// 當文件物件模型(DOM)載入後執行init函數 // 當文件物件模型(DOM)載入後執行init函數
$(document).ready(function() { $(document).ready(function() {
$(document).on('focus','*',function(){ window.temp_scrollY = window.pageYOffset;
if ($('header>.kenjohn').attr('class') == "kenjohn" && $(document.activeElement).is('a.orbit-bar-logo')){ window.temp_scrollX = window.pageXOffset;
if(window.temp_scrollY == undefined){
window.temp_scrollY = document.documentElement.scrollTop;
window.temp_scrollX = document.documentElement.scrollLeft;
}
$(document).on('focusin','*',function(event){
// event.stopPropagation();
var _this = $(document.activeElement);//$(this);
var topOffset = window.temp_scrollY + window.top_barrier_height;
var ele_offset = _this.offset().top - topOffset;
if(ele_offset < 0){
console.log(_this)
window.scroll(window.temp_scrollX, window.temp_scrollY + ele_offset);
window.temp_scrollY = Math.max(window.temp_scrollY + ele_offset, 0);
}
if ($('header>.kenjohn').attr('class') == "kenjohn" && _this.is('a.orbit-bar-logo')){
$('header>.kenjohn').addClass('navRel'); $('header>.kenjohn').addClass('navRel');
$('#gotocenter').focus(); $('#gotocenter').focus();
} }
@ -833,6 +860,7 @@ function transdate(){
}) })
var title_wrapper = $("<div class=\"title-wraper col-sm-12\"></div>") var title_wrapper = $("<div class=\"title-wraper col-sm-12\"></div>")
$('h4.page-module-title').replaceTagName('h3'); $('h4.page-module-title').replaceTagName('h3');
$('h3.i-annc__entry-title').replaceTagName('h4');
title_wrapper.append($('.view_count.pull-right,.page-module-title,#main-content .index-title,.i-member-status-title:eq(0),#main-content > * > [class*="-title"]')); title_wrapper.append($('.view_count.pull-right,.page-module-title,#main-content .index-title,.i-member-status-title:eq(0),#main-content > * > [class*="-title"]'));
$('.row.pagerow').prepend(title_wrapper); $('.row.pagerow').prepend(title_wrapper);
try { try {
@ -886,13 +914,15 @@ function transdate(){
$('.outdropdowns .modules-menu-level-1').css('right','') $('.outdropdowns .modules-menu-level-1').css('right','')
$('.outdropdowns .modules-menu-level-1').css('width','') $('.outdropdowns .modules-menu-level-1').css('width','')
}else{ }else{
var width = $('header #main-nav').outerWidth(); try{
var right = $(window).width() - $('header #main-nav').offset().left - width; var width = $('header #main-nav').outerWidth();
if (width>50){ var right = $(window).width() - $('header #main-nav').offset().left - width;
calc_menu_flag = true; if (width>50){
$('.outdropdowns .modules-menu-level-1').css('right',right); calc_menu_flag = true;
$('.outdropdowns .modules-menu-level-1').css('width',width); $('.outdropdowns .modules-menu-level-1').css('right',right);
} $('.outdropdowns .modules-menu-level-1').css('width',width);
}
}catch(e){};
} }
} }
$(window).resize(function() { $(window).resize(function() {

View File

@ -14,29 +14,44 @@ body{
} }
} }
} }
.downIcon{ .downIcon {
position: absolute; position: absolute;
left: 50%; left: 50%;
bottom: 15%; bottom: 15%;
//bottom: 10%; //bottom: 10%;
z-index: 2; z-index: 2;
color: #fff; color: #fff;
span{
position: absolute; span {
top: 0; position: absolute;
left: 50%; top: 0;
width: 46px; left: 50%;
height: 46px; width: 46px;
margin-left: -23px; height: 46px;
border: 2px solid #fff; margin-left: -23px;
border-radius: 100%; border: 2px solid #fff;
behavior: url("/assets/ie_support/PIE2/PIE.htc"); border-radius: 100%;
box-sizing: border-box; behavior: url("/assets/ie_support/PIE2/PIE.htc");
box-sizing: border-box;
} }
a:hover{
opacity: .5; a:hover span {
width: 60px;
height: 60px;
margin-left: -30px;
top: -7px;
border-width: 4px;
border-color: #facf3d;
} }
} }
.downIcon a:hover span::after {
width: 21px;
height: 21px;
border-left-width: 4px;
border-bottom-width: 4px;
margin: -14px 0 0 -10px;
border-color: #facf3d;
}
.downIcon a span::after{ .downIcon a span::after{
position: absolute; position: absolute;
top: 50%; top: 50%;

View File

@ -0,0 +1,32 @@
<div class="w-annc widget-announcement-1">
<h3 class="w-annc__widget-title">
<span>{{widget-title}}</span>
</h3>
<ul class="w-annc__list" data-level="0" data-list="announcements">
<li class="w-annc__item">
<div class="w-annc__img-wrap bullseye">
<img class="w-annc__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">
</div>
<div class="w-annc__meta">
<span class="w-annc__status-wrap" data-list="statuses" data-level="1">
<span class="w-annc__status label status {{status-class}}">{{status}}</span>
</span>
<span class="w-annc__postdate-wrap" date-format="%Y-%m-%d">
<i class="fa fa-calendar-o"></i>
<span class="w-annc__postdate">{{postdate}}</span>
</span>
<span class="w-annc__category-wrap">
<i class="fa fa-tasks"></i>
<span class="w-annc__category">{{category}}</span>
</span>
</div>
<h4 class="w-annc__entry-title">
<a class="w-annc__title" href="{{link_to_show}}">{{title}}</a>
</h4>
<p class="w-annc__subtitle">{{subtitle}}</p>
</li>
</ul>
<div class="w-annc__more-wrap clearfix">
<a class="w-annc__more btn btn-primary pull-right" href="{{more_url}}"><%= (I18n.locale.to_s =="zh_tw") ? "更多最新消息" : "More NEWS" %></a>
</div>
</div>

View File

@ -305,6 +305,14 @@
"en": "19. 3-Column Standard Text List (widget-title, postdate, category, status, title, subtitle)" "en": "19. 3-Column Standard Text List (widget-title, postdate, category, status, title, subtitle)"
}, },
"thumbnail": "annc_index9_thumbs.png" "thumbnail": "annc_index9_thumbs.png"
},
{
"filename": "annc_widget20",
"name": {
"zh_tw": "20. 標準圖文 ( 模組標題, 圖片, 狀態, 日期, 類別, 標題, 副標題 )",
"en": "20. Standard Image + Text (widget-title, image, status, postdate, category, title, subtitle)"
},
"thumbnail": "annc_widget1_thumbs.png"
} }
] ]
} }

View File

@ -7,7 +7,9 @@
<div class="widget-link_wrapper"> <div class="widget-link_wrapper">
<div class="cycle-slideshow widget-content" style="margin: 0em 3.125em;" <div class="cycle-slideshow widget-content" style="margin: 0em 3.125em;"
data-level="0" data-list="web_link" data-cycle-slides="> li" data-level="0" data-list="web_link" data-cycle-slides="> li"
data-cycle-fx="carousel" data-cycle-timeout="0" data-cycle-carousel-visible="4" data-cycle-pause-on-hover="true" data-cycle-log="false" data-cycle-carousel-fluid="true"> data-cycle-fx="carousel" data-cycle-timeout="0" data-cycle-carousel-visible="4"
data-cycle-carousel-rwd-json="{768: 1}"
data-cycle-pause-on-hover="true" data-cycle-log="false" data-cycle-carousel-fluid="true">
<li class="widget-link__item"> <li class="widget-link__item">
<div class="liWrapper"> <div class="liWrapper">
<img class="widget-link__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}"> <img class="widget-link__img" src="{{img_src}}" alt="{{img_description}}" title="{{img_description}}">

View File

@ -7,7 +7,9 @@
<div class="widget-link_wrapper"> <div class="widget-link_wrapper">
<div class="cycle-slideshow widget-content" style="margin: 0em 3.125em;" <div class="cycle-slideshow widget-content" style="margin: 0em 3.125em;"
data-level="0" data-list="web_link" data-cycle-slides="> li" data-level="0" data-list="web_link" data-cycle-slides="> li"
data-cycle-fx="carousel" data-cycle-timeout="0" data-cycle-carousel-visible="5" data-cycle-pause-on-hover="true" data-cycle-log="false" data-cycle-carousel-fluid="true"> data-cycle-fx="carousel" data-cycle-timeout="0" data-cycle-carousel-visible="5"
data-cycle-carousel-rwd-json="{768: 1}"
data-cycle-pause-on-hover="true" data-cycle-log="false" data-cycle-carousel-fluid="true">
<li class="widget-link__item"> <li class="widget-link__item">
<div class="liWrapper"> <div class="liWrapper">
<a class="widget-content-title" href="{{link_to_show}}" target="_blank" title="{{title_text}}"> <a class="widget-content-title" href="{{link_to_show}}" target="_blank" title="{{title_text}}">

View File

@ -7,7 +7,9 @@
<div class="widget-link_wrapper"> <div class="widget-link_wrapper">
<div class="cycle-slideshow widget-content" style="margin: 0em 3.125em;" <div class="cycle-slideshow widget-content" style="margin: 0em 3.125em;"
data-level="0" data-list="web_link" data-cycle-slides="> li" data-level="0" data-list="web_link" data-cycle-slides="> li"
data-cycle-fx="carousel" data-cycle-timeout="0" data-cycle-carousel-visible="5" data-cycle-pause-on-hover="true" data-cycle-log="false" data-cycle-carousel-fluid="true"> data-cycle-fx="carousel" data-cycle-timeout="0" data-cycle-carousel-visible="5"
data-cycle-carousel-rwd-json="{768: 1}"
data-cycle-pause-on-hover="true" data-cycle-log="false" data-cycle-carousel-fluid="true">
<li class="widget-link__item"> <li class="widget-link__item">
<div class="liWrapper"> <div class="liWrapper">
<a class="widget-content-title" href="{{link_to_show}}" target="_blank" title="{{title_text}}"> <a class="widget-content-title" href="{{link_to_show}}" target="_blank" title="{{title_text}}">