접근성 수정

This commit is contained in:
com02 2021-12-06 18:24:51 +09:00
parent d50f96f02f
commit 0c0e1da0bb
7 changed files with 61 additions and 60 deletions

View File

@ -127,7 +127,7 @@
} }
// 기존 데이터 CLEAR // 기존 데이터 CLEAR
$( ".list-notice li").not('.t-tit-line').not('.no-result').remove(); $( ".list-notice thead").not('.t-tit-line').not('.no-result').remove();
if(!jsonObj.data || jsonObj.data.length <= 0 ) { if(!jsonObj.data || jsonObj.data.length <= 0 ) {
$(".list-notice li.no-result").show(); $(".list-notice li.no-result").show();
@ -223,6 +223,7 @@
<div class="list-table-wrap"> <div class="list-table-wrap">
<table class="list-notice"> <table class="list-notice">
<caption>공지사항 목록 표 NO, 제목, 등록자, 등록일, 첨부로 구성</caption>
<thead class="t-tit-line"> <thead class="t-tit-line">
<tr> <tr>
<th class="t-num">NO</th> <th class="t-num">NO</th>

View File

@ -109,13 +109,13 @@
// 탭선택 처리 // 탭선택 처리
$("[id^=tabQna]").removeClass(); $("[id^=tabQna]").removeClass();
$("[id^=tabQna]").attr("title", ""); //$("[id^=tabQna]").attr("title", "");
var selectedTab = "tabQnaAll"; var selectedTab = "tabQnaAll";
if($("#searchQuestionType").val() == "USER") { if($("#searchQuestionType").val() == "USER") {
selectedTab = "tabQnaUser"; selectedTab = "tabQnaUser";
} }
$("#" + selectedTab).addClass("current"); $("#" + selectedTab).addClass("current");
$("#" + selectedTab).attr("title", "선택됨"); //$("#" + selectedTab).attr("title", "선택됨");
// 건수 // 건수
@ -140,27 +140,27 @@
} }
// 기존 데이터 CLEAR // 기존 데이터 CLEAR
$( "ul.list-notice li").not('.t-tit-line').not('.no-result').remove(); $( ".list-notice thead").not('.t-tit-line').not('.no-result').remove();
if(!jsonObj.data || jsonObj.data.length <= 0 ) { if(!jsonObj.data || jsonObj.data.length <= 0 ) {
$("ul.list-notice li.no-result").show(); $(".list-notice .no-result").show();
} else { } else {
$("ul.list-notice li.no-result").hide(); $(".list-notice .no-result").hide();
// 출력 // 출력
$.each(jsonObj.data,function(key,obj) { $.each(jsonObj.data,function(key,obj) {
var li = $(document.createElement('li')); var li = $(document.createElement('tr'));
li.append($('<span />').attr('class', 't-num').html(obj.rno)); li.append($('<td />').attr('class', 't-num').html(obj.rno));
li.append($('<span />').attr('class', 't-tit').html("<a href=\"javascript:void(0)\" onclick=\"fn_viewDetail('" + obj.articleId + "','" + obj.secretYn + "','" + obj.myQnaYn + "')\">" + li.append($('<td />').attr('class', 't-tit').html("<a href=\"javascript:void(0)\" onclick=\"fn_viewDetail('" + obj.articleId + "','" + obj.secretYn + "','" + obj.myQnaYn + "')\">" +
obj.title + obj.title +
(obj.secretYn == "Y" ? '<img src="/images/icon/icon-password.png" alt="자물쇠 아이콘">&nbsp;' : '') + (obj.secretYn == "Y" ? '<img src="/images/icon/icon-password.png" alt="자물쇠 아이콘">&nbsp;' : '') +
"</a>")); "</a>"));
li.append($('<span />').attr('class', 't-writer').html(obj.regNm)); li.append($('<td />').attr('class', 't-writer').html(obj.regNm));
li.append($('<span />').attr('class', 't-date').html(obj.regDd)); li.append($('<td />').attr('class', 't-date').html(obj.regDd));
li.append($('<span />').attr('class', 't-answer').html((obj.answerYn == "Y" ? '<span class="compl">답변완료</span>' : '<span class="wait">답변대기</span>'))); li.append($('<td />').attr('class', 't-answer').html((obj.answerYn == "Y" ? '<span class="compl">답변완료</span>' : '<span class="wait">답변대기</span>')));
$( "ul.list-notice").append(li); $( ".list-notice").append(li);
}); });
} }
@ -284,18 +284,26 @@
<div class="contents-frame inner-center"> <div class="contents-frame inner-center">
<div class="list-table-wrap"> <div class="list-table-wrap">
<ul class="list-notice"> <table class="list-notice">
<li class="t-tit-line"> <caption>Q&A 목록 표 NO, 제목, 등록자, 등록일, 답변으로 구성</caption>
<span class="t-num">NO</span> <thead class="t-tit-line">
<span class="t-tit">제목</span> <tr>
<span class="t-writer">등록자</span> <th class="t-num">NO</th>
<span class="t-date">등록일</span> <th class="t-tit">제목</th>
<span class="t-answer">답변</span> <th class="t-writer">등록자</th>
</li> <th class="t-date">등록일</th>
<li class="no-result" style="display:none;"> <th class="t-answer">답변</th>
<span>검색결과가 없습니다.</span> </tr>
</li> </thead>
</ul> <thead class="no-result" style="display:none;">
<tr>
<th>검색결과가 없습니다.</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div> </div>
<div class="btn-box"> <div class="btn-box">

View File

@ -225,7 +225,7 @@ $(document).ready(function() {
/* 탭메뉴 */ /* 탭메뉴 */
var selectedIdx = '> li:eq(' + (${cartTypeCd } -1) + ')'; var selectedIdx = '> li:eq(' + (${cartTypeCd } -1) + ')';
$('.cartTab ul.tabs').addClass('active').find(selectedIdx).addClass('current').attr('title','선택됨'); $('.cartTab ul.tabs').addClass('active').find(selectedIdx).addClass('current').find('a').attr('title','선택됨');
$('.tab ul.tabs li a').click(function (g) { $('.tab ul.tabs li a').click(function (g) {
var tab = $(this).closest('.tab'), var tab = $(this).closest('.tab'),

View File

@ -71,7 +71,7 @@ window.onload = function() {
}); });
// 탭 액티브 중복 방지 // 탭 액티브 중복 방지
$(".tab ul.tabs").removeClass("active").find("> li:eq(0)").removeClass("current").removeAttr('title','');; $(".tab ul.tabs").removeClass("active").find("> li:eq(0)").removeClass("current").find('a').removeAttr('title','');;
$("#referencelistForm input:checkbox[name='reQueryChk']").on('change', function() { $("#referencelistForm input:checkbox[name='reQueryChk']").on('change', function() {
if ( $(this).prop('checked') ) if ( $(this).prop('checked') )
@ -109,7 +109,7 @@ window.onload = function() {
function fnSetInitialValue() function fnSetInitialValue()
{ {
//탭 //탭
$("#"+"${searchVO.collection}").parent().addClass('current').attr('title','선택됨'); $("#"+"${searchVO.collection}").parent().addClass('current').find('a').attr('title','선택됨');
//페이징 //페이징
gfn_makePaging("fn_search_article",'${pageVO.pageIndex}','${pageVO.totRecordCount}','${pageVO.startPage}','${pageVO.endPage}','${pageVO.lastPage}'); gfn_makePaging("fn_search_article",'${pageVO.pageIndex}','${pageVO.totRecordCount}','${pageVO.startPage}','${pageVO.endPage}','${pageVO.lastPage}');

View File

@ -31,7 +31,7 @@
.wrap header .inner .log ul li:first-child a {border:0;} .wrap header .inner .log ul li:first-child a {border:0;}
.wrap header .inner .log ul li:last-child a {padding-right:0;} .wrap header .inner .log ul li:last-child a {padding-right:0;}
#skipNav{position:relative;z-index:9999;} #skipNav{position:relative;z-index:9999;}
#skipNav a{position: absolute; top: -200px; left:0; width: 100%; line-height: 30px; border: 1px solid #dedede; background-color: #333;color:#fff;text-align:center;} #skipNav a{position: absolute; top: -200px; left:0;padding:0px 20px; width: auto; line-height: 30px; border: 1px solid #dedede; background-color: #333;color:#fff;text-align:center;}
#skipNav a:focus, #skipNav a:active{top: 0;} #skipNav a:focus, #skipNav a:active{top: 0;}
@ -1600,28 +1600,19 @@ transform: rotate(45deg);}
.qna .inner .tab_content {display:inline-block;background: #fff;width:100%;margin-bottom:50px;} .qna .inner .tab_content {display:inline-block;background: #fff;width:100%;margin-bottom:50px;}
.qna .inner .tabs_item {display: none;padding: 10px 0;} .qna .inner .tabs_item {display: none;padding: 10px 0;}
.qna .inner .tabs_item:first-child {display: block;} .qna .inner .tabs_item:first-child {display: block;}
.qna .list-table-wrap li {display: table;width: 100%;box-sizing: border-box;text-align: center;border-bottom: 1px solid #ddd;font-size: 16px;color: #666;letter-spacing: -0.025em;table-layout: fixed;}
.qna .list-table-wrap li span {display: table-cell;height: 60px;vertical-align: middle;} .qna .list-table-wrap table .t-answer {width:8%;text-align: center;}
.qna .list-table-wrap li .t-num {width: 6%;} .qna .list-table-wrap table .t-answer span {display:inline-block;background:#e6e7e9;height:auto;padding:2px 10px 4px;border-radius: 50px;font-size:12px;}
.qna .list-table-wrap li .t-type {width: 6%;} .qna .list-table-wrap table .t-answer span.compl {background: #b98d4d;color:#fff;font-weight: 400;}
.qna .list-table-wrap li .t-tit {text-align: left;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width: 60%;}
.qna .list-table-wrap li .t-tit a {display: block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width: 100%;font-weight: 300;}
.qna .list-table-wrap li .t-tit a img {vertical-align: middle;margin-left:10px;}
.qna .list-table-wrap li .t-writer {width: 10%;}
.qna .list-table-wrap li .t-date {width: 10%;}
.qna .list-table-wrap li .t-status {width: 10%;}
.qna .list-table-wrap li .t-file {width:auto;}
.qna .list-table-wrap li .t-answer {width:8%;text-align: center;}
.qna .list-table-wrap li .t-answer span {display:inline-block;background:#e6e7e9;height:auto;padding:2px 10px 4px;border-radius: 50px;font-size:12px;}
.qna .list-table-wrap li .t-answer span.compl {background: #b98d4d;color:#fff;font-weight: 400;}
.qna .list-table-wrap .t-tit-line {width: 100%;border-top: 2px solid #000;border-bottom: 1px solid #000;color: #fff;font-size:12px;font-weight:400;background: #556676;} .qna .list-table-wrap .t-tit-line {width: 100%;border-top: 2px solid #000;border-bottom: 1px solid #000;color: #fff;font-size:12px;font-weight:400;background: #556676;}
.qna .list-table-wrap .t-tit-line span {text-align: center;} .qna .list-table-wrap .t-tit-line span {text-align: center;}
.qna .list-table-wrap li .message {width: 100%;text-align: center;} .qna .list-table-wrap table .message {width: 100%;text-align: center;}
.qna .list-table-wrap .t-status em {text-align: center;font-size: 14px;width: 82px;height: 30px;line-height: 30px;display: block;margin: 0 auto;border-radius: 15px;border: 1px solid #ddd;} .qna .list-table-wrap .t-status em {text-align: center;font-size: 14px;width: 82px;height: 30px;line-height: 30px;display: block;margin: 0 auto;border-radius: 15px;border: 1px solid #ddd;}
.qna .list-table-wrap .t-status .complete {border:none;color:#fff;background-color:#154b92;} .qna .list-table-wrap .t-status .complete {border:none;color:#fff;background-color:#154b92;}
.qna .list-table-wrap .list-qna .t-type {width: 175px;} .qna .list-table-wrap .list-qna .t-type {width: 175px;}
.qna .list-table-wrap li .t-type span {background:#b68946;display:inline-block;text-align: center;color:#fff;width:auto;height:auto;padding:1px 10px 2px;border-radius: 50px;} .qna .list-table-wrap table .t-type span {background:#b68946;display:inline-block;text-align: center;color:#fff;width:auto;height:auto;padding:1px 10px 2px;border-radius: 50px;}
.qna .list-table-wrap li:hover .t-tit a {border-bottom:1px solid #376795;padding-bottom:1px;color:#376795;display: inline;} .qna .list-table-wrap table tr:hover .t-tit a {border-bottom:1px solid #376795;padding-bottom:1px;color:#376795;display: inline;}
.qna .list-table-wrap table .t-tit a img {margin-left:10px;}
.qna .btn-box {float:right;} .qna .btn-box {float:right;}
.no-result {padding:60px 0px;font-size:14px;color:#666;text-align:center;} .no-result {padding:60px 0px;font-size:14px;color:#666;text-align:center;}

View File

@ -886,16 +886,17 @@ footer .family_site {right:10px;}
.qna .title .list-input button { background: url("/images/icon/icon-search-mo.png") no-repeat center center; } .qna .title .list-input button { background: url("/images/icon/icon-search-mo.png") no-repeat center center; }
.qna .inner .tabs_item { padding: 0 16px; box-sizing: border-box; } .qna .inner .tabs_item { padding: 0 16px; box-sizing: border-box; }
.qna .list-table-wrap .t-tit-line { display: none; } .qna .list-table-wrap .t-tit-line { display: none; }
.qna .list-table-wrap li { position: relative; font-size: 14px; display: flex; flex-wrap: wrap; align-items: center; } .qna .list-table-wrap table { position: relative; font-size: 14px; display: flex; flex-wrap: wrap; align-items: center; }
.qna .list-table-wrap li span { height: auto; } .qna .list-table-wrap table th,
.qna .list-table-wrap li .t-num { position: absolute; } .qna .list-table-wrap table td { height: auto; }
.qna .list-table-wrap li .t-tit { width: 100%; padding-left: 40px; box-sizing: border-box; } .qna .list-table-wrap table .t-num { position: absolute; }
.qna .list-table-wrap li .t-writer { padding-left: 40px; } .qna .list-table-wrap table .t-tit { width: 100%; padding-left: 40px; box-sizing: border-box; }
.qna .list-table-wrap li .t-writer, .qna .list-table-wrap table .t-writer { padding-left: 40px; }
.qna .list-table-wrap li .t-date, .qna .list-table-wrap table .t-writer,
.qna .list-table-wrap li .t-answer { width: auto; } .qna .list-table-wrap table .t-date,
.qna .list-table-wrap li .t-writer, .qna .list-table-wrap table .t-answer { width: auto; }
.qna .list-table-wrap li .t-date { margin-right: 10px; padding-right: 10px; border-right: 1px solid #ccc; line-height: 1;text-align:left;width:auto !important; } .qna .list-table-wrap table .t-writer,
.qna .list-table-wrap table .t-date { margin-right: 10px; padding-right: 10px; border-right: 1px solid #ccc; line-height: 1;text-align:left;width:auto !important;padding-left:0; }
.qna .btn-box, .qna .btn-box,
.qna .btn-box .btn { width: 100%; } .qna .btn-box .btn { width: 100%; }

View File

@ -18,16 +18,16 @@ $(document).ready(function(){
} }
}); });
/* 인기자료 탭메뉴 */ /* 탭메뉴 */
(function ($) { (function ($) {
$(".tab ul.tabs").addClass("active").find("> li:eq(0)").addClass("current"); $(".tab ul.tabs").addClass("active").find("> li:eq(0)").addClass("current");
$(".tab ul.tabs").addClass("active").find("> li:eq(0)").attr('title','선택됨'); $(".tab ul.tabs").addClass("active").find("> li:eq(0) a").attr('title','선택됨');
$(".tab ul.tabs li a").click(function (g) { $(".tab ul.tabs li a").click(function (g) {
var tab = $(this).closest(".tab"), var tab = $(this).closest(".tab"),
index = $(this).closest("li").index(); index = $(this).closest("li").index();
tab.find("ul.tabs > li").removeClass("current").removeAttr('title',''); tab.find("ul.tabs > li").removeClass("current").find('a').removeAttr('title','');
$(this).closest("li").addClass("current").attr('title','선택됨'); $(this).closest("li").addClass("current").find('a').attr('title','선택됨');
tab.find(".tab_content") tab.find(".tab_content")
.find("div.tabs_item") .find("div.tabs_item")