접근성 수정

This commit is contained in:
com02 2022-01-27 11:42:00 +09:00
parent 771ee2a545
commit 5266b69abc
6 changed files with 39 additions and 28 deletions

View File

@ -118,7 +118,7 @@ function fn_cancle()
<p>이메일 정보가 확인되면 해당 메일로<br><span>임시비밀번호</span>를 보내드립니다.</p> <p>이메일 정보가 확인되면 해당 메일로<br><span>임시비밀번호</span>를 보내드립니다.</p>
</div> </div>
<div class="row find"> <div class="row find">
<p><label for="email">내 이메일 정보</label><input type="text" name="email" placeholder="example@mail.com" class="find-input" onKeypress="javascript:if(event.keyCode==13) {goFindPw();}"/></p> <p><label for="email">내 이메일 정보</label><input type="text" name="email" id="email" title="이메일 정보" placeholder="example@mail.com" class="find-input" onKeypress="javascript:if(event.keyCode==13) {goFindPw();}"/></p>
<p class="text">- 임시 비밀번호가 발급된 후 [마이페이지 &gt; 회원정보관리 &gt; 내 정보]에서 비밀번호를 수정해주세요.</p> <p class="text">- 임시 비밀번호가 발급된 후 [마이페이지 &gt; 회원정보관리 &gt; 내 정보]에서 비밀번호를 수정해주세요.</p>
</div> </div>
<div class="row btn-box"> <div class="row btn-box">

View File

@ -59,9 +59,6 @@ function fn_setPageTitle(title, suffix) {
</head> </head>
<body> <body>
<div id="skipNavi">
<a href="#Contents">본문바로가기</a>
</div>
<!-- <div class="wrap sub"> sub는 서브페이지 --> <!-- <div class="wrap sub"> sub는 서브페이지 -->
<div id="DIV_PAGE_MAIN" class="wrap sub"> <div id="DIV_PAGE_MAIN" class="wrap sub">

View File

@ -60,16 +60,20 @@ function fn_setPageTitle(title, suffix) {
</head> </head>
<body> <body>
<div id="skipNavi">
<a href="#sec1-1">AI추천키워드 바로가기</a>
<a href="#sec3">문화원's Pick 바로가기</a>
<a href="#sec5">인기 자료 바로가기</a>
<a href="#sec6">온라인 자료관 바로가기</a>
</div>
<!-- <div class="wrap sub"> sub는 서브페이지 --> <!-- <div class="wrap sub"> sub는 서브페이지 -->
<div id="DIV_PAGE_MAIN" class="wrap sub"> <div id="DIV_PAGE_MAIN" class="wrap sub">
<div id="skipNavi" class="Main">
<a href="#sec1-1">AI추천키워드 바로가기</a>
<a href="#sec3">문화원's Pick 바로가기</a>
<a href="#sec5">인기 자료 바로가기</a>
<a href="#sec6">온라인 자료관 바로가기</a>
</div>
<div id="skipNavi" class="Sub">
<a href="#Contents">본문바로가기</a>
</div>
<!-- 헤더 --> <!-- 헤더 -->
<header id="header"> <header id="header">
<tiles:insertAttribute name="header" /> <tiles:insertAttribute name="header" />

View File

@ -2120,7 +2120,12 @@ animation: animate-bg2 2.0s 1.9s ease-in infinite;
.scrollhidden {overflow:hidden;height:100%;position:fixed;} .scrollhidden {overflow:hidden;height:100%;position:fixed;}
/* skipNavi */ /* skipNavi */
#skipNavi{position:relative;left:0;top:0;width:100%;z-index:99999;} #skipNavi{position:fixed;left:0;top:0;width:100%;z-index:99999;}
#skipNavi a{overflow:hidden;display:block;width:1px;height:1px;margin-bottom:-1px;color:#0068b0;font-size:16px;text-align:center;text-decoration:none} #skipNavi a{overflow:hidden;display:block;width:1px;height:1px;margin-bottom:-1px;color:#0068b0;font-size:16px;text-align:center;text-decoration:none}
#skipNavi a:active, #skipNavi a:active,
#skipNavi a:focus{width:100%;height: auto;padding:5px 0;background-color:#ddd} #skipNavi a:focus{width:100%;height: auto;padding:5px 0;background-color:#ddd}
.wrap #skipNavi.Main {display:block;}
.wrap #skipNavi.Sub {display:none;}
.wrap.sub #skipNavi.Sub {display:block;}
.wrap.sub #skipNavi.Main {display:none;}

View File

@ -332,36 +332,36 @@ yx-axis
/* default theme ("light") */ /* default theme ("light") */
.mCSB_scrollTools{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCSB_scrollTools{ opacity: 0.75; filter: alpha(opacity=75); -ms-filter: alpha(opacity=75); }
.mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 0; filter: "alpha(opacity=0)"; -ms-filter: "alpha(opacity=0)"; } .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 0; filter: alpha(opacity=0); -ms-filter: alpha(opacity=0); }
.mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollBox:hover > .mCSB_scrollTools, .mCustomScrollBox:hover > .mCSB_scrollTools,
.mCustomScrollBox:hover ~ .mCSB_scrollTools, .mCustomScrollBox:hover ~ .mCSB_scrollTools,
.mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; } .mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 1; filter: alpha(opacity=100); -ms-filter: alpha(opacity=100); }
.mCSB_scrollTools .mCSB_draggerRail{ .mCSB_scrollTools .mCSB_draggerRail{
background-color: #000; background-color: rgba(0,0,0,0.4); background-color: #000; background-color: rgba(0,0,0,0.4);
filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; filter: alpha(opacity=40); -ms-filter: alpha(opacity=40);
} }
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-color: #fff; background-color: rgba(255,255,255,0.75); background-color: #fff; background-color: rgba(255,255,255,0.75);
filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; filter: alpha(opacity=75); -ms-filter: alpha(opacity=75);
} }
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{
background-color: #fff; background-color: rgba(255,255,255,0.85); background-color: #fff; background-color: rgba(255,255,255,0.85);
filter: "alpha(opacity=85)"; -ms-filter: "alpha(opacity=85)"; filter: alpha(opacity=85); -ms-filter: alpha(opacity=85);
} }
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
background-color: #fff; background-color: rgba(255,255,255,0.9); background-color: #fff; background-color: rgba(255,255,255,0.9);
filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; filter: alpha(opacity=90); -ms-filter: alpha(opacity=90);
} }
.mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonUp,
@ -370,7 +370,7 @@ yx-axis
.mCSB_scrollTools .mCSB_buttonRight{ .mCSB_scrollTools .mCSB_buttonRight{
background-image: url(mCSB_buttons.png); /* css sprites */ background-image: url(mCSB_buttons.png); /* css sprites */
background-repeat: no-repeat; background-repeat: no-repeat;
opacity: 0.4; filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; opacity: 0.4; filter: alpha(opacity=40); -ms-filter: alpha(opacity=40);
} }
.mCSB_scrollTools .mCSB_buttonUp{ .mCSB_scrollTools .mCSB_buttonUp{
@ -412,12 +412,12 @@ yx-axis
.mCSB_scrollTools .mCSB_buttonUp:hover, .mCSB_scrollTools .mCSB_buttonUp:hover,
.mCSB_scrollTools .mCSB_buttonDown:hover, .mCSB_scrollTools .mCSB_buttonDown:hover,
.mCSB_scrollTools .mCSB_buttonLeft:hover, .mCSB_scrollTools .mCSB_buttonLeft:hover,
.mCSB_scrollTools .mCSB_buttonRight:hover{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCSB_scrollTools .mCSB_buttonRight:hover{ opacity: 0.75; filter: alpha(opacity=75); -ms-filter: alpha(opacity=75); }
.mCSB_scrollTools .mCSB_buttonUp:active, .mCSB_scrollTools .mCSB_buttonUp:active,
.mCSB_scrollTools .mCSB_buttonDown:active, .mCSB_scrollTools .mCSB_buttonDown:active,
.mCSB_scrollTools .mCSB_buttonLeft:active, .mCSB_scrollTools .mCSB_buttonLeft:active,
.mCSB_scrollTools .mCSB_buttonRight:active{ opacity: 0.9; filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; } .mCSB_scrollTools .mCSB_buttonRight:active{ opacity: 0.9; filter: alpha(opacity=90); -ms-filter: alpha(opacity=90); }
/* theme: "dark" */ /* theme: "dark" */
@ -737,7 +737,7 @@ yx-axis
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg=="); background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==");
background-repeat: repeat-y; background-repeat: repeat-y;
opacity: 0.3; opacity: 0.3;
filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; filter: alpha(opacity=30); -ms-filter: alpha(opacity=30);
} }
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
@ -814,7 +814,7 @@ yx-axis
.mCS-3d.mCSB_scrollTools, .mCS-3d.mCSB_scrollTools,
.mCS-3d-dark.mCSB_scrollTools{ .mCS-3d-dark.mCSB_scrollTools{
opacity: 1; opacity: 1;
filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; filter: alpha(opacity=30); -ms-filter: alpha(opacity=30);
} }
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
@ -891,7 +891,7 @@ yx-axis
.mCS-3d-thick.mCSB_scrollTools, .mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools{ .mCS-3d-thick-dark.mCSB_scrollTools{
opacity: 1; opacity: 1;
filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; filter: alpha(opacity=30); -ms-filter: alpha(opacity=30);
} }
.mCS-3d-thick.mCSB_scrollTools, .mCS-3d-thick.mCSB_scrollTools,
@ -1025,13 +1025,13 @@ yx-axis
.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ .mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-color: #fff; background-color: rgba(255,255,255,0.2); background-color: #fff; background-color: rgba(255,255,255,0.2);
filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)"; filter: alpha(opacity=20); -ms-filter: alpha(opacity=20);
} }
.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ .mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
background-color: #fff; background-color: rgba(255,255,255,0.5); background-color: #fff; background-color: rgba(255,255,255,0.5);
filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)"; filter: alpha(opacity=50); -ms-filter: alpha(opacity=50);
} }
@ -1039,13 +1039,13 @@ yx-axis
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-color: #000; background-color: rgba(0,0,0,0.2); background-color: #000; background-color: rgba(0,0,0,0.2);
filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)"; filter: alpha(opacity=20); -ms-filter: alpha(opacity=20);
} }
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
background-color: #000; background-color: rgba(0,0,0,0.5); background-color: #000; background-color: rgba(0,0,0,0.5);
filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)"; filter: alpha(opacity=50); -ms-filter: alpha(opacity=50);
} }
/* ---------------------------------------- */ /* ---------------------------------------- */

View File

@ -525,6 +525,11 @@ $(document).ready(function(){
$('.wrap .nav-wrap #primary-nav ul li .sub-menu').hide(); $('.wrap .nav-wrap #primary-nav ul li .sub-menu').hide();
}); });
$('.wrap.sub .nav-wrap #primary-nav ul li:nth-of-type(4) .sub-menu li:nth-of-type(4) a').focusout(function (){
$('.wrap .nav-wrap #primary-nav ul li .sub-menu').hide();
});
// 접근성 공유하기 팝업 // 접근성 공유하기 팝업
$(".data.detail .inner .row-top .center .right .con-1 button.share").keydown(function (e) { $(".data.detail .inner .row-top .center .right .con-1 button.share").keydown(function (e) {
if (e.keyCode == 13) { if (e.keyCode == 13) {