2023/11/02 퀵메뉴 수정

src/main/webapp/WEB-INF/jsp/web/com/webCommonQuickMenu.jsp

@@ -16,3 +16,26 @@
 
 </script>
 
+<div class="quick_menu_wrap">
+	<div class="quick_title">
+		<p>퀵메뉴</p>
+	</div>
+	<ul class="quick_ul">
+		<li class="quick_li">
+			<a href="#none" data-tooltip="glossary_popup"><i class="icon_quickmenu_glossary"></i>용어해설</a>
+		</li>
+		<li class="quick_li">
+			<a href="#none"><i class="icon_quickmenu_adj_case"></i>조정사례</a>
+		</li>
+		<li class="quick_li">
+			<a href="#none"><i class="icon_quickmenu_apl_form"></i>조정신청</a>
+		</li>
+		<li class="quick_li">
+			<a href="#none"><i class="icon_quickmenu_progress_case"></i>진행상황</a>
+		</li>
+		<!-- <li class="quick_li">
+			<a href="#none"><i class="icon_quickmenu_fee"></i>수수료 조회</a>
+		</li> -->
+	</ul>
+
+</div>

src/main/webapp/kccadrPb/usr/css/common.css

@@ -107,9 +107,9 @@ footer address p:first-child{margin-bottom: 8px;}
 .error_page .error_btn button {background-color:#1b6fcd; color: #fff; padding: 8px 25px; font-size: 16px;}
 
 /* quick menu */
-.quick_menu_wrap{position:fixed;top:50%;right:8%;transform:translateY(-50%);z-index:20;}
+.quick_menu_wrap{position:fixed;top:50%;right:5%;transform:translateY(-50%);z-index:20;}
 .quick_menu_wrap .quick_title{width:85px;height:35px;border-radius:5px 5px 0 0;background-color:#ea5404;color:#fff;font-size:18px;font-weight:500;text-align:center;line-height:33px;margin:0 auto;}
-.quick_menu_wrap .quick_ul{width:110px;border-radius:5px;box-shadow:0 0 5px rgba(0,0,0,0.2);padding:10px 10px 20px 10px;box-sizing:border-box;}
+.quick_menu_wrap .quick_ul{width:110px;border-radius:5px;box-shadow:0 0 5px rgba(0,0,0,0.2);padding:10px 10px 20px 10px;box-sizing:border-box;background:#fff;}
 .quick_menu_wrap .quick_li{font-size:16px;font-weight:400;text-align:center;letter-spacing:-0.45px;margin:0 0 10px 0;transition:all 0.15s ease-in-out;}
 .quick_menu_wrap .quick_li:last-child{margin:0 0 0 0;}
 .quick_menu_wrap .quick_li i{display:block;width:100%;height:50px;text-align:center;background-repeat:no-repeat;background-position:center;margin:0 0 5px 0;transition:all 0.15s ease-in-out;}
@@ -125,6 +125,15 @@ footer address p:first-child{margin-bottom: 8px;}
 .quick_menu_wrap .quick_li:hover .icon_quickmenu_progress_case{background-image:url(/kccadrPb/usr/image/common/icon_quickmenu_progress_case_hover.png);}
 .quick_menu_wrap .quick_li:hover .icon_quickmenu_fee{background-image:url(/kccadrPb/usr/image/common/icon_quickmenu_fee_hover.png);}
 
+@media all and (max-width: 1640px){
+	.quick_menu_wrap{right:2%;}	
+}
+
+@media all and (max-width: 1540px){
+	.quick_menu_wrap{right:calc(0% - 110px);transition:all 0.15s ease-in-out;}
+	.quick_menu_wrap.on{right:-4px;transition:all 0.15s ease-in-out;}
+	.quick_menu_wrap .quick_title{position:absolute;width:30px;height:auto;top:50%;left:-30px;transform:translateY(-50%);line-height:1;padding:20px 0;border-radius:10px 0 0 10px;}
+}
 
 @media all and (max-width: 1280px){
 	/* header */

src/main/webapp/kccadrPb/usr/script/common.js

@@ -81,6 +81,17 @@ $(document).ready(function () {
 	/* ie는 readonly를 지원하지 않아서 css 적용 */
 	$("input[readonly='']").addClass("read-only");
 	/* //ie는 readonly를 지원하지 않아서 css 적용 */
+	
+	//퀵메뉴
+	$(".quick_title").on("click",function(){
+		if($("html").width()<1541){
+			if($(".quick_menu_wrap").is(".on")==true){
+				$(".quick_menu_wrap").removeClass("on");
+			}else{
+				$(".quick_menu_wrap").addClass("on");
+			}
+		}
+	})
 });
 
 /* 화면 리사이즈 시 */
@@ -93,6 +104,7 @@ $(window).resize(function () {
 		$(".btn_menu").attr("title", "모바일메뉴 열기"); // 1024 이하 시 title 변경
 		$(".full_menu").removeClass("on");
 	}
+	$(".quick_menu_wrap").removeClass("on");
 });
 /* //화면 리사이즈 시 */
 

src/main/webapp/kccadrPb/usr/sub_glossary.html

@@ -90,7 +90,7 @@
 		<a href="#sub" class="contGo" title="본문 바로가기">본문 바로가기</a>
 	</div>
 
-	<div class="quick_menu_wrap">
+	<div class="quick_menu_wrap on">
 		<div class="quick_title">
 			<p>퀵메뉴</p>
 		</div>
@@ -102,14 +102,14 @@
 				<a href="#none"><i class="icon_quickmenu_adj_case"></i>조정사례</a>
 			</li>
 			<li class="quick_li">
-				<a href="#none"><i class="icon_quickmenu_apl_form"></i>신청서 작성</a>
+				<a href="#none"><i class="icon_quickmenu_apl_form"></i>조정신청</a>
 			</li>
 			<li class="quick_li">
-				<a href="#none"><i class="icon_quickmenu_progress_case"></i>사건진행</a>
+				<a href="#none"><i class="icon_quickmenu_progress_case"></i>진행상황</a>
 			</li>
-			<li class="quick_li">
+			<!-- <li class="quick_li">
 				<a href="#none"><i class="icon_quickmenu_fee"></i>수수료 조회</a>
-			</li>
+			</li> -->
 		</ul>
 
 	</div>