1<!DOCTYPE html> 2<html lang="ko"> 3<meta charset="utf-8"> 4<meta content="width=device-width, initial-scale=1, user-scalable=no" name="viewport"> 5<meta name="_csrf" content="LgyHG6Eb51X8XXIwSf2pPxISPi2fO1tIHlXq1_yuLEgLXrMMH23jeMJ_1zPRbhRTLdCdXiEiExT-X2plemHS7szIGyo6a4E7"/> <!-- CSRF í í° --> 6<meta name="_csrf_header" content="X-CSRF-TOKEN"/> <!-- CSRF í¤ë ì´ë¦ --> 7<!--favicon--> 8<link href="/member/images/favicon.png" rel="icon" type="image/png"/> 9 10<title>ì´ì°íì°</title> 11 12<!--<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-nice-select/1.1.0/css/nice-select.css">--> 13<link href="/member/css/datepicker.css" rel="stylesheet"/> 14<link href="/member/css/flatpickr.css" rel="stylesheet"/> 15<link href="/member/css/common.css" rel="stylesheet"> 16<link href="/member/plugins/sg-validate/css/sg_validate.css" rel="stylesheet"/> 17<link href="/member/css/components.css" rel="stylesheet"/> 18<link href="/member/css/program.css" rel="stylesheet"/> 19<link href="/member/css/reset.css" rel="stylesheet"/> 20<link href="/member/css/content.css" rel="stylesheet"/> 21<link href="/member/css/responsive.css" rel="stylesheet"/> 22<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/quill.snow.css" rel="stylesheet"/> 23
24<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
24 25<!--plugins-->
26<script src="/member/js/jquery.min.js"></script>
vendor: 2 bytes, line 26
26
27<script src="/member/js/jquery-1.12.0.min.js"></script>
vendor: 2 bytes, line 27
27
28<script src="/member/js/jquery-ui.min.js"></script>
vendor: 2 bytes, line 28
28
29<script src="/member/js/function_jquery.js" type="text/javascript"></script>
vendor: 2 bytes, line 29
29
30<script src="/member/js/function.js" type="text/javascript"></script>
vendor: 2 bytes, line 30
30
31<script src="/member/js/datepicker.js" type="text/javascript"></script>
vendor: 2 bytes, line 31
31
32<script src="/member/js/preview.js" type="text/javascript"></script>
vendor: 2 bytes, line 32
32
33<script src="/member/js/component.js" type="text/javascript"></script>
vendor: 2 bytes, line 33
33
34<script src="/member/js/event.js" type="text/javascript"></script>
vendor: 2 bytes, line 34
34
35<script src="/member/plugins/sg-validate/js/sg_validate.js" type="text/javascript"></script>
35 36
37<script src="https://t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>
37 38 39<!--
39<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-nice-select/1.1.0/js/jquery.nice-select.min.js"></script>
39--> 40 41<!-- datetimepicker --> 42<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.min.css" 43 media="screen" rel="stylesheet" 44 type="text/css">
45<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.full.min.js"></script>
45 46 47<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/slimselect.css" rel="stylesheet">
48<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/slimselect.min.js"></script>
48 49 50<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> 51 52<link href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css" rel="stylesheet"/>
53<script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>
53 54 55<link href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css" rel="stylesheet">
56<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
vendor: 2 bytes, line 56
56
57<script src="https://cdn.jsdelivr.net/npm/flatpickr/dist/l10n/ko.js"></script>
vendor: 2 bytes, line 57
57
58<script src="/member/js/common.js"></script>
58 59<!-- ë°°ì¡ì¡°í ì¤í¬ë¦½í¸ -->
60<script src="/js/delivery-tracking.js"></script>
60 61 62<link rel="canonical" href="https://leeyeon.shop" /> 63 64 65 66<body> 67<div class="wrapper no_foot no_quick"> 68 <!--í¤ë ë¶ë¶--> 69 <!-- <th:block th:insert="~{member/includes/header.html}"/>--> 70 71 <header id="header"> 72 <div class="header-body"> 73 <div class="header-inner"> 74 <!-- í¤ë ë¶ê¸° ì²ë¦¬ --> 75 76 <!-- í¤ë íì 1 : ë©ì¸ --> 77 78 79 <!-- í¤ë íì 2 : ë¤ë¡ê°ê¸°, íì´í --> 80 <div class="flex-box align-items-center justify-content-between header-tit"> 81 <a class="back-btn" href="javascript:;" onclick="history.back();"> 82 <img src="/member/images/ico_arrow_back.svg" width="8"> 83 </a> 84 <h1>íì´í</h1> 85 <em style="font-size: 0; width: 8px;"></em> 86 </div> 87 88 <!-- í¤ë íì 3 : ë¤ë¡ê°ê¸°, ì¥ë°êµ¬ë --> 89 90 91 <!-- í¤ë íì 4 : ìíê²ì ë¡ê³ or ê°ê²ë³´ê¸° ë¡ê³ or ë§ì´íì´ì§ ë¡ê³ , ìì¹, ì¥ë°êµ¬ë --> 92 93 94 <!-- í¤ë íì 5 : ë¤ë¡ê°ê¸°, íì´í, ìì¹, ì¥ë°êµ¬ë --> 95 96 97 <!-- í¤ë íì 6 : ë¤ë¡ê°ê¸°, íì´í, í --> 98 99 100 <!-- í¤ë íì 7 : ë¤ë¡ê°ê¸°, í, ìíëª , ìì¹, ì¥ë°êµ¬ë --> 101 102 103 <!-- í¤ë íì 8 : ë¤ë¡ê°ê¸°, í, í기&ìíëª orê°ê²ëª , ìì¹, ì¥ë°êµ¬ë --> 104 105 106 <!-- í¤ë íì 9 : ë¤ë¡ê°ê¸°, í, íì´í, ìì¹, ì¥ë°êµ¬ë --> 107 108 109 <!-- í¤ë íì 10 : ë¤ë¡ê°ê¸° --> 110 111 112 <!-- í¤ë íì 11 : ìëì° íì ì© ë¤ë¡ê°ê¸°, íì´í --> 113 114 115 </div> 116 </div> 117 </header> 118 119 <!-- ê²ì íì --> 120 <div class="popup rightAniPopup" data-open-type="" id="searchPopup"> 121 <div class="popup-body big"> 122 <div class="popup-inner"> 123 <div class="popup-header"> 124 <button class="popup-close2" onclick="rightClosePopup('#searchPopup');" type="button"></button> 125 <a class="p-relative" href="/member/order/cart"> 126 <img src="/member/images/ico_cart.svg" width="22"> 127 128 </a> 129 </div> 130 <div class="popup-cont"> 131 <form action="/member/search/result" class="searchForm" method="get"> 132 <div class="input-wrap"> 133 <input autocomplete="off" class="searchInput input" name="searchWord" 134 placeholder="ê²ìì´ë¥¼ ì ë ¥íì¸ì." type="text" 135 value=""> 136 <button class="input-remove-btn" type="button"><img src="/member/images/ico_close_wht.svg"> 137 </button> 138 <button type="submit"><img src="/member/images/ico_search.svg" width="20"></button> 139 </div> 140 </form> 141 <div class="bottom-cont"> 142 <div class="sub-title mb-0 pb-15"> 143 <h3>ìµê·¼ ê²ìì´</h3> 144 <button class="fs13 fw400 ls-026 lh1 txt-gray999 flex-box align-items-center gap-3 all-delete-btn" 145 type="button"> 146 <img src="/member/images/ico_trash.svg" width="13">ì ì²´ìì 147 </button> 148 </div> 149 <div class="swiper searchRecentSwiper"> 150 <div class="swiper-wrapper"> 151 <div class="swiper-slide"> 152 íì° 153 <button class="searchRecentSwiper-deleteBtn" type="button"><img 154 height="8" src="/member/images/ico_close_gray.svg" width="8"></button> 155 </div> 156 <div class="swiper-slide"> 157 ì¼ê²¹ì´ 158 <button class="searchRecentSwiper-deleteBtn" type="button"><img 159 height="8" src="/member/images/ico_close_gray.svg" width="8"></button> 160 </div> 161 <div class="swiper-slide"> 162 ëª©ì´ 163 <button class="searchRecentSwiper-deleteBtn" type="button"><img 164 height="8" src="/member/images/ico_close_gray.svg" width="8"></button> 165 </div> 166 <div class="swiper-slide">
167 ì 물ì¸í¸ 168 <button class="searchRecentSwiper-deleteBtn" type="button"><img 169 height="8" src="/member/images/ico_close_gray.svg" width="8"></button> 170 </div> 171 <div class="swiper-slide"> 172 ê°ë¹ 173 <button class="searchRecentSwiper-deleteBtn" type="button"><img 174 height="8" src="/member/images/ico_close_gray.svg" width="8"></button> 175 </div> 176 <div class="swiper-slide"> 177 ì°ì¤ 178 <button class="searchRecentSwiper-deleteBtn" type="button"><img 179 height="8" src="/member/images/ico_close_gray.svg" width="8"></button> 180 </div> 181 </div> 182 </div> 183 <div class="sub-title mt-40"> 184 <h3>ìì¦ <span class="txt-blue fw700">HOT</span>í ì¸ê¸°ìí</h3> 185 </div> 186 <div class="swiper hotProductSwiper"> 187 <div class="swiper-wrapper"> 188 <div class="swiper-slide"> 189 <a href="javascript:;"> 190 <div class="product-type1"> 191 <!-- 192 íì ì¼ ê²½ì° img-boxì soldout í´ëì¤ ì¶ê° ë¶íë립ëë¤ 193 --> 194 <div class="img-box"> 195 <img alt="" src="/member/images/ex_img1.jpg"> 196 <button class="like-btn" type="button"></button> 197 <div class="soldout-box"><span>íì </span></div> 198 </div> 199 <p class="prdt-name t-rw rw-2">íì° ê°ë¹ BBQ ìëì </p> 200 <b class="cost">153,000ì</b> 201 <p class="disc-amount"><b class="disc-rate">20%</b>123,000<span>ì</span></p> 202 </div> 203 </a> 204 </div> 205 <div class="swiper-slide"> 206 <a href="javascript:;"> 207 <div class="product-type1"> 208 <!-- 209 íì ì¼ ê²½ì° img-boxì soldout í´ëì¤ ì¶ê° ë¶íë립ëë¤ 210 --> 211 <div class="img-box"> 212 <img alt="" src="/member/images/ex_img2.jpg"> 213 <button class="like-btn" type="button"></button> 214 <div class="soldout-box"><span>íì </span></div> 215 </div> 216 <p class="prdt-name t-rw rw-2">íì° ë¬´êµ ë¯¸ìêµ ê°ë¹í ëê°ëí ê³°í ì¬ë¦ë³´ìì</p> 217 <b class="cost">153,000ì</b> 218 <p class="disc-amount"><b class="disc-rate">20%</b>123,000<span>ì</span></p> 219 </div> 220 </a> 221 </div> 222 <div class="swiper-slide"> 223 <a href="javascript:;"> 224 <div class="product-type1"> 225 <!-- 226 íì ì¼ ê²½ì° img-boxì soldout í´ëì¤ ì¶ê° ë¶íë립ëë¤ 227 --> 228 <div class="img-box"> 229 <img alt="" src="/member/images/ex_img3.jpg"> 230 <button class="like-btn" type="button"></button> 231 <div class="soldout-box"><span>íì </span></div> 232 </div> 233 <p class="prdt-name t-rw rw-2">
233ìì°½ íì° 1ë±ê¸ 200g ì´ì° ë±ì¬ ì¤í ì´í¬ ìê³ ê¸° 구ì´ì© í¹ìë¶ì</p> 234 <b class="cost">153,000ì</b> 235 <p class="disc-amount"><b class="disc-rate">20%</b>123,000<span>ì</span></p> 236 </div> 237 </a> 238 </div> 239 <div class="swiper-slide"> 240 <a href="javascript:;"> 241 <div class="product-type1"> 242 <!-- 243 íì ì¼ ê²½ì° img-boxì soldout í´ëì¤ ì¶ê° ë¶íë립ëë¤ 244 --> 245 <div class="img-box"> 246 <img alt="" src="/member/images/ex_img4.jpg"> 247 <button class="like-btn" type="button"></button> 248 <div class="soldout-box"><span>íì </span></div> 249 </div> 250 <p class="prdt-name t-rw rw-2">ìê´ êµ´ë¹ ì 물ì¸í¸ ë²ì±í¬ ì¤ë¹ ë¤</p> 251 <b class="cost">153,000ì</b> 252 <p class="disc-amount"><b class="disc-rate">20%</b>123,000<span>ì</span></p> 253 </div> 254 </a> 255 </div> 256 </div> 257 </div> 258 </div> 259 </div> 260 </div> 261 </div> 262 </div> 263 264 <!-- ê´ë¦¬ì ë±ë¡ íì ìí --> 265 <!-- <div id="preview_popup" class="preview_popup" data-open-type="" style="left: 48%; top: 22%; transform: translate(-50%, -50%);"> 266 <div class="popup_wrap" style="left: 50px"> 267 <div class="lined"> 268 <div class="popup-cont"> 269 <div class="img-box" style="width: 250px; padding-bottom: 150px;"> 270 <img id="popup_img" src="/admin/images/ex_img3.jpg"> 271 </div> 272 <div class="btnSet flex-box justify-content-between align-items-center gap-10"> 273 <div class="check_box"> 274 <input type="checkbox" id="not_open" name="open_type"> 275 <label for="not_open">ì¤ëì ê·¸ë§ ë³´ê¸°</label> 276 </div> 277 <button type="button" onclick="closePopup('#preview_popup', 'fade');">ë«ê¸°</button> 278 </div> 279 </div> 280 </div> 281 </div> 282 </div> 283 <div id="preview_popup2" class="preview_popup" data-open-type="" style="left: 50%; top: 50%; transform: translate(-50%, -50%);"> 284 <div class="popup_wrap" style="left: 50px"> 285 <div class="lined"> 286 <div class="popup-cont"> 287 <div class="img-box" style="width: 300px; padding-bottom: 300px;"> 288 <img id="popup_img2" src="/member/images/mVisual1.jpg"> 289 </div> 290 <div class="btnSet flex-box justify-content-between align-items-center gap-10"> 291 <div class="check_box"> 292 <input type="checkbox" id="not_open2" name="open_type"> 293 <label for="not_open2">ì¤ëì ê·¸ë§ ë³´ê¸°</label> 294 </div> 295 <button type="button" onclick="closePopup('#preview_popup2', 'fade');">ë«ê¸°</button> 296 </div> 297 </div> 298 </div> 299 </div> 300 </div>--> 301 <!-- ê´ë¦¬ì ë±ë¡ íì ìí ë --> 302 303
303<script> 304 $(document).ready(function () { 305 //ìµê·¼ ê²ìì´ ì¤ìì´í¼ 306 let searchRecentSwiper = new Swiper(".searchRecentSwiper", { 307 spaceBetween: 5, 308 slidesPerView: 'auto', 309 }); 310 window.searchRecentSwiper = searchRecentSwiper; 311 312 //ìµê·¼ ê²ìì´ ê°ë³ ìì 313 $(document).on('click', '.searchRecentSwiper-deleteBtn', function () { 314 $(this).closest('.swiper-slide').remove(); 315 searchRecentSwiper.update(); 316 // ì¿ í¤ììë ìì 317 let searchWord = $(this).closest('.swiper-slide').text().trim(); 318 removeSearchWordFromCookie(searchWord); 319 }); 320 321 //ìµê·¼ ê²ìì´ ì ì²´ìì 322 const allDeleteBtn = $('#searchPopup .all-delete-btn'); 323 allDeleteBtn.on('click', function () { 324 $('.searchRecentSwiper .swiper-slide').remove(); 325 searchRecentSwiper.update(); 326 // ì¿ í¤ììë ì ì²´ ìì 327 deleteCookie('recentSearchWords'); 328 }); 329 330 // ê²ìì´ í´ë¦ ì ê²ì ì¤í (X ë²í¼ í´ë¦ ì ì ì¸) 331 $(document).on('click', '.searchRecentSwiper .swiper-slide', function(e) { 332 // X ë²í¼ í´ë¦ ììë ê²ì ì¤ííì§ ìì 333 if ($(e.target).closest('.searchRecentSwiper-deleteBtn').length > 0) { 334 return; 335 } 336 let searchWord = $(this).text().trim(); 337 $('#searchPopup .searchInput').val(searchWord); 338 if (!searchWord) { 339 return; 340 } 341 saveSearchWordToCookie(searchWord); 342 try { 343 sessionStorage.setItem('memberSearchFlow', 'popup_to_result'); 344 sessionStorage.setItem('memberSearchLastQuery', searchWord); 345 } catch (e) { /* ignore */ } 346 var f = document.querySelector('#searchPopup .searchForm'); 347 if (f && typeof f.requestSubmit === 'function') { 348 f.requestSubmit(); 349 } else { 350 window.location.href = '/member/search/result?searchWord=' + encodeURIComponent(searchWord); 351 } 352 }); 353 354 //íì¬ HOT ìí ì¤ìì´í¼ 355 window.hotProductSwiper = new Swiper(".hotProductSwiper", { 356 spaceBetween: 10, 357 slidesPerView: 'auto' 358 }); 359 360 // í¤ë íì 4 ë¶ê¸°ì²ë¦¬ 361 let currentUrl = window.location.pathname; 362 363 /*if (currentUrl.includes('/member/search/category') || currentUrl.includes('/member/search/category')) { 364 $('.page-title').text('ì´ì° ìíê²ì'); 365 } else if (currentUrl.includes('/member/mypage')) { 366 $('.page-title').text('ì´ì° ë§ì´íì´ì§'); 367 } else if (currentUrl.includes('/member/store/list')) { 368 $('.page-title').text('ì´ì° ê°ê²ë³´ê¸°'); 369 $('.header-tit > a').attr('href', 'javascript:;'); 370 371 $('.header-tit > a').on('click', function () { 372 $('html, body').animate({ 373 scrollTop: 0 374 }, 300) 375 }); 376 }*/ 377 378 // í¤ë íì 4 ë¶ê¸°ì²ë¦¬ 379 if (currentUrl.includes('/member/product/review')) { 380 $('.header-tit h1').text('ì ì²´í기'); 381 } else if (currentUrl.includes('/member/store/review')) { 382 $('.header-tit h1').text('ìíí기'); 383 } 384 385 // ê²ì í¼ ì ì¶: ì ì¶í í¼ì ì ë ¥ê°ë§ ì¿ í¤ì ì ì¥, ê²ì íì ìì ë³´ë¸ ê²½ì° ë¤ë¡ê°ê¸° ì íì ë³µìì© íëê·¸ 386 $(document).on('submit', '.searchForm', function () { 387 let searchWord = $(this).find('.searchInput').first().val(); 388 if (typeof searchWord === 'string') { 389 searchWord = searchWord.trim(); 390 } else { 391 searchWord = ''; 392 } 393 if (searchWord) { 394 saveSearchWordToCookie(searchWord); 395 } 396 if (searchWord && $(this).closest('#searchPopup').length) { 397 try { 398 sessionStorage.setItem('memberSearchFlow', 'popup_to_result'); 399 sessionStorage.setItem('memberSearchLastQuery', searchWord); 400 } catch (e) { /* ignore */ } 401 } 402 }); 403 404 function isMemberHomePath() { 405 var p = window.location.pathname || ''; 406 return p === '/member' || p === '/member/'; 407 } 408 409 function isHistoryBackForwardNavigation() { 410 var entries = performance.getEntriesByType && performance.getEntriesByType('navigation');
411 if (entries && entries.length > 0 && entries[0].type === 'back_forward') { 412 return true; 413 } 414 if (typeof performance !== 'undefined' && performance.navigation && performance.navigation.type === 2) { 415 return true; 416 } 417 return false; 418 } 419 420 function tryReopenMemberSearchPopupFromBack() { 421 try { 422 if (sessionStorage.getItem('memberSearchFlow') !== 'popup_to_result') { 423 return false; 424 } 425 var q = sessionStorage.getItem('memberSearchLastQuery') || ''; 426 sessionStorage.removeItem('memberSearchFlow'); 427 sessionStorage.removeItem('memberSearchLastQuery'); 428 $('#searchPopup .searchInput').val(q); 429 if (typeof searchPopup === 'function') { 430 searchPopup('#searchPopup'); 431 } 432 return true; 433 } catch (e) { 434 return false; 435 } 436 } 437 438 $(window).on('pageshow', function (ev) { 439 if (!isMemberHomePath()) { 440 return; 441 } 442 var oe = ev.originalEvent || ev; 443 var fromBfCache = oe && oe.persisted === true; 444 var backLike = fromBfCache || isHistoryBackForwardNavigation(); 445 if (backLike) { 446 if (tryReopenMemberSearchPopupFromBack()) { 447 return; 448 } 449 } 450 try { 451 sessionStorage.removeItem('memberSearchFlow'); 452 sessionStorage.removeItem('memberSearchLastQuery'); 453 } catch (e) { /* ignore */ } 454 }); 455 456 // íì ìë íì ë° ì¿ í¤ ì²´í¬ 457 $('.preview_popup').each(function() { 458 let popupIdx = $(this).data('popup-idx'); 459 let pWidth = $(this).data('p-width'); 460 let pHeight = $(this).data('p-height'); 461 let pPositionType = $(this).data('p-position-type'); 462 let pPositionTop = $(this).data('p-position-top'); 463 let pPositionLeft = $(this).data('p-position-left'); 464 465 if (popupIdx) { 466 // íì í¬ê¸° ì¤ì 467 if (pWidth && pHeight) { 468 $(this).find('.popup_wrap').css({ 469 "width": pWidth + "px", 470 "height": pHeight + "px", 471 "max-width": "90vw", 472 "max-height": "90vh" 473 }); 474 $(this).find('img').css({ 475 "width": "100%", 476 "height": "100%", 477 "object-fit": "contain" 478 }); 479 } 480 481 // íì ìì¹ ì¤ì 482 if (pPositionType == 1) { 483 // íë©´ ì ê°ì´ë° 484 $(this).css({ 485 "position": "fixed", 486 "top": "50%", 487 "left": "50%", 488 "transform": "translate(-50%, -50%)" 489 }); 490 } else { 491 // ì§ì ë ìì¹ê° ì¬ì© 492 if (pPositionTop !== undefined && pPositionLeft !== undefined) { 493 $(this).css({ 494 "position": "fixed", 495 "top": pPositionTop + "px", 496 "left": pPositionLeft + "px", 497 "transform": "none" 498 }); 499 } 500 } 501 502 // ì¿ í¤ ì²´í¬íì¬ ì¨ê¹ ì²ë¦¬ë íì ì¸ì§ íì¸ 503 if (!hidePopupByCookie(popupIdx)) { 504 // ì¨ê¹ ì²ë¦¬ëì§ ìì íì ì ìëì¼ë¡ íì 505 setTimeout(function() { 506 if (typeof openPopup === 'function') { 507 openPopup('#preview_popup' + popupIdx, 'fade'); 508 } else { 509 // ì§ì íì íì 510 $('#preview_popup' + popupIdx).show(); 511 $('#preview_popup' + popupIdx).fadeIn(200); 512 } 513 }, 500); 514 } 515 } 516 }); 517
518 // íì ì´ë¯¸ì§ í´ë¦ ì ìì°½ì¼ë¡ URL ì´ê¸° 519 $(document).on('click', '.preview_popup img', function() { 520 let popupUrl = $(this).attr('data-popup-url'); 521 if (popupUrl && popupUrl.trim() !== '') { 522 window.open(popupUrl, '_blank'); 523 } 524 }); 525 }); 526 527 // ì¿ í¤ì ê²ìì´ ì ì¥ (ìµë 10ê°) 528 function saveSearchWordToCookie(searchWord) { 529 let recentWords = getRecentSearchWords(); 530 531 // ì´ë¯¸ ì¡´ì¬íë ê²ìì´ê° ìì¼ë©´ ì ê±° 532 recentWords = recentWords.filter(word => word !== searchWord); 533 534 // ìë¡ì´ ê²ìì´ë¥¼ 맨 ìì ì¶ê° 535 recentWords.unshift(searchWord); 536 537 // ìµë 10ê°ê¹ì§ë§ ì ì§ 538 if (recentWords.length > 10) { 539 recentWords = recentWords.slice(0, 10); 540 } 541 542 // ì¿ í¤ì ì ì¥ (30ì¼ ì í¨) 543 setCookie('recentSearchWords', JSON.stringify(recentWords), 30); 544 } 545 546 // ì¿ í¤ìì ìµê·¼ ê²ìì´ ê°ì ¸ì¤ê¸° 547 function getRecentSearchWords() { 548 let cookieValue = getCookie('recentSearchWords'); 549 if (cookieValue) { 550 try { 551 return JSON.parse(cookieValue); 552 } catch (e) { 553 return []; 554 } 555 } 556 return []; 557 } 558 559 // ì¿ í¤ìì í¹ì ê²ìì´ ìì 560 function removeSearchWordFromCookie(searchWord) { 561 let recentWords = getRecentSearchWords(); 562 recentWords = recentWords.filter(word => word !== searchWord); 563 setCookie('recentSearchWords', JSON.stringify(recentWords), 30); 564 } 565 566 // ì¿ í¤ ì¤ì í¨ì (URL ì¸ì½ë© ì ì©) 567 function setCookie(name, value, days) { 568 let expires = ""; 569 if (days) { 570 let date = new Date(); 571 date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); 572 expires = "; expires=" + date.toUTCString(); 573 } 574 // URL ì¸ì½ë©ì ì ì©íì¬ íê¸ ë¬¸ì ì²ë¦¬ 575 let encodedValue = encodeURIComponent(value || ""); 576 document.cookie = name + "=" + encodedValue + expires + "; path=/"; 577 } 578 579 // ì¿ í¤ ê°ì ¸ì¤ê¸° í¨ì (URL ëì½ë© ì ì©) 580 function getCookie(name) { 581 let nameEQ = name + "="; 582 let ca = document.cookie.split(';'); 583 for (let i = 0; i < ca.length; i++) { 584 let c = ca[i]; 585 while (c.charAt(0) == ' ') c = c.substring(1, c.length); 586 if (c.indexOf(nameEQ) == 0) { 587 let cookieValue = c.substring(nameEQ.length, c.length); 588 // URL ëì½ë©ì ì ì©íì¬ íê¸ ë¬¸ì ë³µì 589 return decodeURIComponent(cookieValue); 590 } 591 } 592 return null; 593 } 594 595 // ì¿ í¤ ìì í¨ì 596 function deleteCookie(name) { 597 document.cookie = name + '=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;'; 598 } 599 600 // íì ì¨ê¹ ì²ë¦¬ í¨ì 601 function hidePopupByCookie(popupIdx) { 602 let cookieName = 'popup_hide_' + popupIdx; 603 let today = new Date().toDateString(); 604 let cookieValue = getCookie(cookieName); 605 let localStorageValue = localStorage.getItem(cookieName); 606 607 // ì¿ í¤ ëë localStorage ì¤ íëë¼ë ì¤ë ë ì§ì ì¼ì¹íë©´ ì¨ê¹ 608 if (cookieValue === today || localStorageValue === today) { 609 $('#preview_popup' + popupIdx).hide(); 610 return true; // ì¨ê¹ ì²ë¦¬ë¨ 611 } 612 return false; // ì¨ê¹ ì²ë¦¬ëì§ ìì 613 } 614 615 // íì ì¿ í¤ ì¤ì í¨ì 616 function setPopupHideCookie(popupIdx) { 617 let cookieName = 'popup_hide_' + popupIdx; 618 let today = new Date().toDateString(); 619 620 // ì¿ í¤ì localStorage ë ë¤ ì¤ì
621 setCookie(cookieName, today, 1); // 1ì¼ê° ì ì§ 622 localStorage.setItem(cookieName, today); 623 } 624 625 // ì²´í¬ë°ì¤ í´ë¦ ì´ë²¤í¸ ì²ë¦¬ 626 $(document).on('change', 'input[name="open_type"]', function() { 627 if ($(this).is(':checked')) { 628 let popupIdx = $(this).data('popup-idx'); 629 if (popupIdx) { 630 setPopupHideCookie(popupIdx); 631 closePopup('#preview_popup' + popupIdx, 'fade'); 632 } 633 } 634 }); 635 636 // ìµê·¼ ê²ìì´ë¥¼ íë©´ì íì 637 function displayRecentSearchWords() { 638 let recentWords = getRecentSearchWords(); 639 let html = ''; 640 641 recentWords.forEach(function(word) { 642 html += '<div class="swiper-slide">'; 643 html += '<p class="t-rw rw-1 max-w-82">' + word + '</p>'; 644 html += '<button class="searchRecentSwiper-deleteBtn" type="button"><img height="8" src="/member/images/ico_close_gray.svg" width="8"></button>'; 645 html += '</div>'; 646 }); 647 648 $('.searchRecentSwiper .swiper-wrapper').html(html); 649 650 // ì¤ìì´í¼ ì ë°ì´í¸ 651 if (window.searchRecentSwiper) { 652 window.searchRecentSwiper.update(); 653 } 654 } 655 656 function searchPopup(id) { 657 // ìµê·¼ ê²ìì´ íì 658 displayRecentSearchWords(); 659 660 $.ajax({ 661 url: '/member/popularProductList', 662 type: 'GET', 663 dataType: 'json', 664 success: function(data) { 665 let html = ''; 666 if (data && data.length > 0) { 667 data.forEach(function(product) { 668 let soldoutClass = product.p_stock == 0 ? 'soldout' : ''; 669 let soldoutBox = product.p_stock == 0 ? '<div class="soldout-box"><span>íì </span></div>' : ''; 670 let discountHtml = ''; 671 if (product.p_discount_yn === 'Y' && product.p_discount_rate > 0) { 672 discountHtml = '<p class="disc-amount"><b class="disc-rate">' + product.p_discount_rate + '%</b>' + 673 product.p_discount_price.toLocaleString() + '<span>ì</span></p>'; 674 } 675 let popularLabel = product.p_set_popular_label == 'Y' ? 676 '<div class="label-area"><span class="increase-label">ì¤ìê° ì¸ê¸°ìì¹</span></div>' : ''; 677 678 html += '<div class="swiper-slide">'; 679 html += '<a href="/member/product/view?p_idx=' + product.p_idx + '">'; 680 html += '<div class="product-type1">'; 681 html += '<div class="img-box ' + soldoutClass + '">'; 682 html += '<img alt="" src="/download?saved_path=' + product.p_img_path + '&filename_org=' + product.p_img_name + '&filename_real=' + product.p_img_name + '">'; 683 html += '<button class="like-btn" type="button"></button>'; 684 html += soldoutBox; 685 html += '</div>'; 686 html += '<p class="prdt-name t-rw rw-2">' + product.p_name + '</p>'; 687 html += '<b class="cost">' + product.p_price.toLocaleString() + 'ì</b>'; 688 html += discountHtml; 689 html += '</div>'; 690 html += '</a>'; 691 html += '</div>'; 692 }); 693 } 694 $('.hotProductSwiper .swiper-wrapper').html(html); 695 696 // ì¤ìì´í¼ ì ë°ì´í¸ 697 if (window.hotProductSwiper) { 698 window.hotProductSwiper.update(); 699 } 700 }, 701 error: function(xhr, status, error) { 702 console.error('ì¸ê¸°ìí ë°ì´í° ë¡ë ì¤í¨:', error); 703 } 704 }); 705 706 rightOpenPopup(id); 707 } 708 </script>
708 709 710 <!-- ì¬ì©ì íì --> 711 712 <!-- ì¬ì©ì íì ë --> 713 714
714<script> 715 $(document).ready(function () { 716 $('.header-tit h1').text("ìí ê²ì"); 717 }) 718 </script>
718 719 720 <!--ì½í ì¸ ë¶ë¶--> 721 <div class="container search-category-page h_no_bottom" id="sub"> 722 <section class="section section1"> 723 <div class="section-body"> 724 <div class="section-inner"> 725 <div class="section-row column"> 726 <div class="section-column"> 727 <div class="cont-area"> 728 <form action="/member/search/result" class="searchForm" method="get"> 729 <div class="input-wrap"> 730 <input autocomplete="off" class="searchInput input" name="searchWord" 731 placeholder="íì°? ì¼ê²¹ì´? ìë¶ê³ 기?" 732 type="text" value=""> 733 <button class="input-remove-btn" type="button"><img 734 src="/member/images/ico_close_wht.svg"></button> 735 <button type="submit"><img src="/member/images/ico_search.svg" width="20"> 736 </button> 737 </div> 738 </form> 739 <div class="sideMenu"> 740 <a class="on" data-idx="1" href="javascript:;">ì 물ì¸í¸</a> 741 <a data-idx="2" href="javascript:;">íì°</a> 742 <a data-idx="3" href="javascript:;">ë¼ì§</a> 743 <a data-idx="4" href="javascript:;">ìì ì°</a> 744 <a data-idx="5" href="javascript:;">ì</a> 745 <a data-idx="6" href="javascript:;">ì¤ëì í¹ê°</a> 746 </div> 747 <div class="menuList"> 748 <ul> 749 <li> 750 <h2> 751 <img class="icon" src="/member/images/ico_logo.svg"> 752 <a href="/member/product?s_c_parent_idx=1">ì 물ì¸í¸ ì ì²´</a> 753 <img height="10" src="/member/images/ico_arrow_right_gray.svg" 754 width="6"> 755 </h2> 756 757 <a href="/member/product?s_c_parent_idx=1&s_c_child_idx=24">íì°ì 물ì¸í¸</a> 758 759 <a href="/member/product?s_c_parent_idx=1&s_c_child_idx=25">ë¼ì§ì 물ì¸í¸</a> 760 761 </li> 762 <li> 763 <h2> 764 <img class="icon" src="/member/images/ico_logo.svg"> 765 <a href="/member/product?s_c_parent_idx=2">íì° ì ì²´</a> 766 <img height="10" src="/member/images/ico_arrow_right_gray.svg" 767 width="6"> 768 </h2> 769 770 <a href="/member/product?s_c_parent_idx=2&s_c_child_idx=26">ë±ì¬</a> 771 772 <a href="/member/product?s_c_parent_idx=2&s_c_child_idx=27">ìì¬</a> 773 774 <a href="/member/product?s_c_parent_idx=2&s_c_child_idx=28">ê°ë¹</a> 775 776 <a href="/member/product?s_c_parent_idx=2&s_c_child_idx=29">ì´ì¹</a> 777 778 <a href="/member/product?s_c_parent_idx=2&s_c_child_idx=30">ì±ë</a> 779 780 <a href="/member/product?s_c_parent_idx=2&s_c_child_idx=31">êµê±°ë¦¬/ë¶ê³ 기</a> 781 782 <a href="/member/product?s_c_parent_idx=2&s_c_child_idx=32">ì¡í</a> 783 784 <a href="/member/product?s_c_parent_idx=2&s_c_child_idx=41">ì¹ë§ì´</a> 785 786 <a href="/member/product?s_c_parent_idx=2&s_c_child_idx=42">ì ì§ì´</a> 787 788 <a href="/member/product?s_c_parent_idx=2&s_c_child_idx=43">ì ë¹ì¶ë¦¬</a> 789 790 <a href="/member/product?s_c_parent_idx=2&s_c_child_idx=44">ë¶ì±ì´</a> 791 792 <a href="/member/product?s_c_parent_idx=2&s_c_child_idx=45">í ìì´</a> 793 794 <a href="/member/product?s_c_parent_idx=2&
794s_c_child_idx=46">ìì°½ì´</a> 795 796 </li> 797 <li> 798 <h2> 799 <img class="icon" src="/member/images/ico_logo.svg"> 800 <a href="/member/product?s_c_parent_idx=3">ë¼ì§ ì ì²´</a> 801 <img height="10" src="/member/images/ico_arrow_right_gray.svg" 802 width="6"> 803 </h2> 804 805 <a href="/member/product?s_c_parent_idx=3&s_c_child_idx=33">ì¼ê²¹ì´</a> 806 807 <a href="/member/product?s_c_parent_idx=3&s_c_child_idx=34">목ì´</a> 808 809 <a href="/member/product?s_c_parent_idx=3&s_c_child_idx=35">íì ì´</a> 810 811 <a href="/member/product?s_c_parent_idx=3&s_c_child_idx=36">ê°ë¸ë¦¬ì´</a> 812 813 <a href="/member/product?s_c_parent_idx=3&s_c_child_idx=37">ìë¤ë¦¬ì´</a> 814 815 <a href="/member/product?s_c_parent_idx=3&s_c_child_idx=38">ë·ë¤ë¦¬ì´</a> 816 817 <a href="/member/product?s_c_parent_idx=3&s_c_child_idx=39">기íë¶ì</a> 818 819 </li> 820 <li> 821 <h2> 822 <img class="icon" src="/member/images/ico_logo.svg"> 823 <a href="/member/product?s_c_parent_idx=4">ìì ì° ì ì²´</a> 824 <img height="10" src="/member/images/ico_arrow_right_gray.svg" 825 width="6"> 826 </h2> 827 828 <a href="/member/product?s_c_parent_idx=4&s_c_child_idx=40">LAê°ë¹</a> 829 830 </li> 831 <li> 832 <h2> 833 <img class="icon" src="/member/images/ico_logo.svg"> 834 <a href="/member/product?s_c_parent_idx=5">ì ì ì²´</a> 835 <img height="10" src="/member/images/ico_arrow_right_gray.svg" 836 width="6"> 837 </h2> 838 839 </li> 840 <li> 841 <h2> 842 <img class="icon" src="/member/images/ico_logo.svg"> 843 <a href="/member/product?s_c_parent_idx=6">ì¤ëì í¹ê°</a> 844 <img height="10" src="/member/images/ico_arrow_right_gray.svg" 845 width="6"> 846 </h2> 847 848 <a href="/member/product?s_c_parent_idx=6&s_c_child_idx=48">êµ´ë¹</a> 849 850 <a href="/member/product?s_c_parent_idx=6&s_c_child_idx=49">ê°ì¹</a> 851 852 <a href="/member/product?s_c_parent_idx=6&s_c_child_idx=50">íì°</a> 853 854 </li> 855 </ul> 856 </div> 857 </div> 858 </div> 859 </div> 860 </div> 861 </div> 862 </section> 863 </div> 864 <footer id="footer"> 865 <!-- íí° --> 866 <div class="footer-cont"> 867 <ul class="flex-box gap-5 mb-15 btnSet"> 868 <li class="wid100"> 869 <a class="btn" href="/member/cscenter/notice">ê³µì§ì¬í</a> 870 </li> 871 <li class="wid100"> 872 <a class="btn" href="/member/cscenter/inquiry">1:1문ì</a> 873 </li> 874 <li class="wid100"> 875 <a class="btn pc1280-flex" href="/store/login">í매ì ì ì ì ì²</a> 876 <a class="btn mo1280-flex" href="javascript:;" onclick="alert('PCììë§ ì ì ê°ë¥í ìë¹ì¤ì ëë¤.'); window.location.href='/member'; return false;">í매ì ì ì ì ì²</a> 877 </li> 878 </ul> 879 <img height="30" src="/member/images/logo.svg" width="65"> 880 <ul class="foot-info"> 881 <li> 882 <p>ë²ì¸ëª (ìí¸): 주ìíì¬ ì´ì°íì°</p> 883 <p>ëíì(ì±ëª ): ê¹ìì§</p> 884 </li> 885 <li> 886 <p><a href="tel:1644-2720">ì í: 1644-2720</a></p> 887 <p>ì¬ì ì ë±ë¡ë²í¸: 565 888 <wbr> 889 -86 890 <wbr> 891 -03129 892 </p> 893 </li> 894 <li> 895 <p>íµì í매ì ì ê³ : ì 2024-ì¸ì²ì°ì구-3612í¸</p> 896 </li> 897 <li> 898 <p>주ì: ì¸ì² ì°ì구 컨벤ììëë¡ 81 ë림ìí° 5층 509-J195í¸</p> 899 </li> 900 <li> 901 <p><a href="mailto:[email protected]">ì´ë©ì¼: [email protected]</a></p> 902 <p>ê°ì¸ì ë³´ë³´í¸ì± ìì: ê¹ìì§</p> 903 </li> 904 </ul> 905 <div class="flex-box gap-5 mt-15 mb-15"> 906 <a class="btn border_ddd fs12 fw500 txt-gray666 ls-024 wid100 white-space-nowrap" href="javascript:;" 907 onclick="openWindowPopup({ url: '/member/includes/policyWindowPopup', width: 390 });">ê°ì¸ì ë³´ 908 ì²ë¦¬ ë° ì·¨ê¸ë°©ì¹¨</a> 909 <a class="btn border_ddd fs12 fw500 txt-gray666 ls-024 wid100 white-space-nowrap" href="javascript:;" 910 onclick="openWindowPopup({ url: '/member/includes/termsWindowPopup', width: 390 });">ìë¹ì¤ 911 ì´ì©ì½ê´</a> 912 </div> 913 <p class="lh1 fs11 fw400 txt-gray999 ls-022">Copyright © ì´ì°íì°. All rights reserved.</p> 914 <p class="long-txt">주ìíì¬ ì´ì°íì°ë íµì í매ì¤ê°ìë¡ì, ì ì í매ìê° ë±ë¡í ìí ì ë³´ ë° ê´ë ¨ 주문/ë°°ì¡ì ëí´ ë²ì ì¸ ì± ìì ì§ì§ ììµëë¤. ëí, ì ì í매ìì ìí ì ë³´ë ìë¹ì¤ 915 ì 공과 ê´ë ¨íì¬ ìë¹ì ë³´í¸ë²ì ë°ë¥¸ ë²ì ì± ìì´ ë°ìíë ê²½ì°, í´ë¹ ì± ì
915ì ì ì í매ììê² ê·ìë©ëë¤.</p> 916 </div> 917 918 <!-- ë ë° --> 919 <div id="dockbar"> 920 <ul class="flex-box align-items-center hgt100"> 921 <li> 922 <a href="/member"> 923 <img class="dock_nor" src="/member/images/ico_home.svg" width="20"> 924 <img class="on" src="/member/images/ico_home_blue.svg" width="20"> 925 <span>í</span> 926 </a> 927 </li> 928 <li> 929 <a href="/member/search/category"> 930 <img class="dock_nor" src="/member/images/ico_search.svg" width="20"> 931 <img class="on" src="/member/images/ico_search_blue.svg" width="20"> 932 <span>ìíê²ì</span> 933 </a> 934 </li> 935 <li> 936 <a href="javascript:;" onclick="bottomOpenPopup('#iyeonGoPopup');"> 937 <img class="dock_nor" src="/member/images/ico_iy_meet.svg" width="20"> 938 <!-- <img class="on" src="/member/images/ico_iy_meet_blue.svg" width="20">--> 939 <span>ì´ì°íì°<br>ë°ë¡ê°ê¸°</span> 940 </a> 941 </li> 942 <li> 943 <a href="/member/store/list"> 944 <img class="dock_nor" src="/member/images/ico_store_black.svg" width="20"> 945 <img class="on" src="/member/images/ico_store_blue_big.svg" width="20"> 946 947 <span>ê°ê²ë³´ê¸°</span> 948 </a> 949 </li> 950 <li> 951 <a href="/member/mypage"> 952 <img class="dock_nor" src="/member/images/ico_mypage.svg" width="20"> 953 <img class="on" src="/member/images/ico_mypage_blue.svg" width="20"> 954 <span>ë§ì´íì´ì§</span> 955 </a> 956 </li> 957 </ul> 958 </div> 959 <div class="popup bg bottomAniPopup type2-popup" id="iyeonGoPopup"> 960 <div class="popup-body big"> 961 <div class="popup-inner"> 962 <div class="popup-title"> 963 <h2>ì´ì°íì° ë°ë¡ê°ê¸°</h2> 964 <a class="popup-close" href="javascript:;" onclick="bottomClosePopup('#iyeonGoPopup');"></a> 965 </div> 966 <div class="popup-cont flex-box gap-10"> 967 <a class="iyeon-box" href="/member/store/view?s_idx=3"> 968 <img height="52" src="/member/images/ico_iyeon_box1.svg" width="45"> 969 <em class="fs18 fw600 ls-036 lh252 block mt10 mb-5">ì´ì°íì°<br>ìí<br>ë°ë¡ë³´ê¸°</em> 970 <p class="fs13 fw400 ls-026 lh182 txt-gray666">ì´í ë´ì ìë<br>ì´ì°íì° ê°ê²ë¡ ì´ëí´ì!</p> 971 </a> 972 <a class="iyeon-box" href="https://brand.naver.com/leeyeon"> 973 <img height="52" src="/member/images/ico_iyeon_box2.svg" width="45"> 974 <em class="fs18 fw600 ls-036 lh252 block mt10 mb-5">ë¤ì´ë²<br>ì¤ë§í¸ì¤í ì´<br>ë°ë¡ê°ê¸°</em> 975 <p class="fs13 fw400 ls-026 lh182 txt-gray666">ì´ì°íì°ì ë¤ì´ë² ì¤ë§í¸<br>ì¤í ì´ íì´ì§ë¡ ì´ëí´ì!</p> 976 </a> 977 </div> 978 </div> 979 </div> 980 </div> 981 <!-- ë ë° ë --> 982 983 <!-- íµë©ë´ --> 984 <div class="quick"> 985 <a class="top-btn" href="javascript:;"> 986 <img src="/member/images/ico_line_arrow_top.svg" width="18"> 987 </a> 988 </div> 989</footer> 990
991<script> 992 $(document).ready(function () { 993 let currentUrl = window.location.href; 994 const dockbar = $('#dockbar'); 995 const dockbarItem = $('#dockbar li'); 996 const bottom_fixed = $('.bottom_fixed'); 997 const bottom_fixed2 = $('.bottom_fixed2'); 998 const quick = $('.quick'); 999 const mainPage = $('#main'); 1000 const footer = $('#footer .footer-cont'); 1001 dockbarItem.children('a').removeClass('on'); 1002 1003 if (currentUrl.includes('search') && dockbar.css('display') !== 'none') { 1004 dockbarItem.eq(1).children('a').addClass('on'); 1005 quick.css('bottom', '85px'); 1006 } else if (currentUrl.includes('store') && dockbar.css('display') !== 'none') { 1007 dockbarItem.eq(3).children('a').addClass('on'); 1008 quick.css('bottom', '85px'); 1009 } else if (currentUrl.includes('mypage') && dockbar.css('display') !== 'none') { 1010 dockbarItem.eq(4).children('a').addClass('on'); 1011 } else { 1012 dockbarItem.eq(0).children('a').addClass('on'); 1013 quick.css('bottom', '15px'); 1014 } 1015 1016 if (bottom_fixed.is(':visible') && footer.is(':visible')) { 1017 quick.css('bottom', '75px'); 1018 footer.addClass('pad-plus'); 1019 } 1020 1021 if (bottom_fixed2.is(':visible') && footer.is(':visible')) { 1022 quick.css('bottom', '75px'); 1023 footer.addClass('pad-plus2'); 1024 } 1025 1026 if (mainPage.is(':visible')) { 1027 footer.addClass('mainPage'); 1028 quick.css('bottom', '85px'); 1029 } 1030 1031 }); 1032</script>
1032 1033 1034</div> 1035
1036<script> 1037 $(document).ready(function () { 1038 let isAutoScrolling = false; 1039 1040 let contAreaTop = $('.cont-area').offset().top; 1041 let liPositions = []; 1042 $('.menuList li').each(function () { 1043 liPositions.push($(this).offset().top); 1044 }); 1045 let forceOnIdx = null; 1046 let forceOnTimer = null; 1047 1048 function lockOn(idx, ms = 1200) { 1049 forceOnIdx = idx; 1050 clearTimeout(forceOnTimer); 1051 forceOnTimer = setTimeout(() => { 1052 forceOnIdx = null; 1053 }, ms); 1054 } 1055 1056 // â ì¤í¬ë¡¤ ê°ë¥í ì리먼í¸(iOS ëì) 1057 const $scrollEl = $(document.scrollingElement || document.documentElement); 1058 1059 function getMaxScrollTop() { 1060 const docH = Math.max( 1061 document.body.scrollHeight, document.documentElement.scrollHeight, 1062 document.body.offsetHeight, document.documentElement.offsetHeight, 1063 document.body.clientHeight, document.documentElement.clientHeight 1064 ); 1065 return Math.max(0, docH - window.innerHeight); 1066 } 1067 1068 function clampScrollTop(y) { 1069 return Math.max(0, Math.min(y, getMaxScrollTop())); 1070 } 1071 1072 $(window).on('scroll', function () { 1073 // ìë ì¤í¬ë¡¤ ì¤ì´ê±°ë, í´ë¦ ì ê¸ ì¤ì´ë©´ ì¤í¬ë¡¤ë¡ onì ë°ê¾¸ì§ ìì 1074 if (isAutoScrolling || forceOnIdx !== null) { 1075 if (forceOnIdx !== null) { 1076 $('.sideMenu a').removeClass('on'); 1077 $('.sideMenu a[data-idx="' + forceOnIdx + '"]').addClass('on'); 1078 } 1079 return; 1080 } 1081 1082 const scrollTop = $(window).scrollTop(); 1083 const currentPosition = scrollTop - contAreaTop + 100; 1084 1085 $('.sideMenu a').removeClass('on'); 1086 1087 if (scrollTop <= contAreaTop) { 1088 $('.sideMenu a').eq(0).addClass('on'); 1089 } else { 1090 for (let i = 0; i < liPositions.length; i++) { 1091 if (currentPosition >= liPositions[i] - contAreaTop) { 1092 $('.sideMenu a').removeClass('on'); 1093 $('.sideMenu a').eq(i).addClass('on'); 1094 } 1095 } 1096 } 1097 }); 1098 1099 // í´ë¦ ì´ë²¤í¸ ----------------------------- 1100 const sideMenu = $('.sideMenu a'); 1101 1102 function getTargetTopByIdx(idx) { 1103 // 기존 ë³´ì ê° ì ì§ (1: -125, 2: -90, ëë¨¸ì§ 0) 1104 const $li = $('.menuList ul li').eq(idx - 1); 1105 if (!$li.length) return 0; 1106 let top = $li.offset().top; 1107 if (idx === 1) top -= 125; 1108 else if (idx === 2) top -= 90; 1109 return top; 1110 } 1111 1112 sideMenu.on('click', function (e) { 1113 e.preventDefault(); 1114 1115 const idx = $(this).data('idx'); 1116 1117 // í´ë¦ ì¦ì on 1118 $('.sideMenu a').removeClass('on'); 1119 $(this).addClass('on'); 1120 1121 // ìë ì¤í¬ë¡¤ ì ê¸ 1122 isAutoScrolling = true; 1123 lockOn(idx, 1500); 1124 1125 // 목ì ì§ ê³ì° + â ë°ë¥ í´ë¨í 1126 const rawTarget = getTargetTopByIdx(idx); 1127 const targetTop = clampScrollTop(rawTarget); 1128 1129 // â ìì ë§(complete ì íë iOS ì¼ì´ì¤ ëë¹) 1130 let unlockTimer = setTimeout(() => { 1131 isAutoScrolling = false; 1132 }, 600); 1133 1134 // â iOS í¸í ì¤í¬ë¡¤ ì리먼í¸ì animate 1135 $scrollEl.stop(true).animate( 1136 {scrollTop: targetTop}, 1137 { 1138 duration: 300, 1139 complete: function () { 1140 clearTimeout(unlockTimer); 1141 isAutoScrolling = false; 1142 } 1143 } 1144 ); 1145 }); 1146 1147 $(window).on('wheel touchstart', function () { 1148 if (!isAutoScrolling) forceOnIdx = null; 1149 }); 1150 1151 $(window).on('resize', function () { 1152 contAreaTop = $('.cont-area').offset().top; 1153 liPositions = []; 1154 $('.menuList li').each(function () { 1155 liPositions.push($(this).offset().top); 1156 }); 1157 }); 1158 });
1159 1160</script>
1160 1161</body> 1162</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.