|
|
@@ -521,6 +521,47 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</th:block>
|
|
|
+ <th:block th:if="${contentsLoc=='010'}">
|
|
|
+ <!-- 10. 당신을 위한 제안 -->
|
|
|
+ <div class="content main_foryou">
|
|
|
+ <div class="cont_head">
|
|
|
+ <p class="displayH">당신을 위한 제안</p>
|
|
|
+ <span>스타일24에서 가장 주목받는 상품을 살펴보세요</span>
|
|
|
+ </div>
|
|
|
+ <div class="cont_body">
|
|
|
+ <div class="post-sug fy_nav">
|
|
|
+ <div class="swiper-container">
|
|
|
+ <div class="swiper-wrapper" id="keywordArea">
|
|
|
+ <div class="swiper-slide">
|
|
|
+ <ul>
|
|
|
+ <li><button class="btn btn_shape active" data-tab="fy1"><div><span class="number">1</span><span>BUCKAROO 기모청바지 겨울 팬츠 컨버스 주니어 모이몰른</span></div></button><a href="#none">자세히 보기</a></li>
|
|
|
+ <li><button class="btn btn_shape" data-tab="fy2"><div><span class="number">2</span><span>기모청바지</span></div></button><a href="#none">자세히 보기</a></li>
|
|
|
+ <li><button class="btn btn_shape" data-tab="fy3"><div><span class="number">3</span><span>겨울 팬츠</span></div></button><a href="#none">자세히 보기</a></li>
|
|
|
+ <li><button class="btn btn_shape" data-tab="fy4"><div><span class="number">4</span><span>컨버스 주니어</span></div></button><a href="#none">자세히 보기</a></li>
|
|
|
+ <li><button class="btn btn_shape" data-tab="fy5"><div><span class="number">5</span><span>모이몰른</span></div></button><a href="#none">자세히 보기</a></li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ <div class="swiper-slide">
|
|
|
+ <ul>
|
|
|
+ <li><button class="btn btn_shape" data-tab="fy6"><div><span class="number">6</span><span>컨버스 주니어</span></div></button><a href="#none">자세히 보기</a></li>
|
|
|
+ <li><button class="btn btn_shape" data-tab="fy7"><div><span class="number">7</span><span>겨울 팬츠</span></div></button><a href="#none">자세히 보기</a></li>
|
|
|
+ <li><button class="btn btn_shape" data-tab="fy8"><div><span class="number">8</span><span>BUCKAROO</span></div></button><a href="#none">자세히 보기</a></li>
|
|
|
+ <li><button class="btn btn_shape" data-tab="fy9"><div><span class="number">9</span><span>모이몰른</span></div></button><a href="#none">자세히 보기</a></li>
|
|
|
+ <li><button class="btn btn_shape" data-tab="fy10"><div><span class="number">10</span><span>기모청바지</span></div></button><a href="#none">자세히 보기</a></li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="swiper-controls">
|
|
|
+ <div class="swiper-pagination"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div id="recomItemArea">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
</th:block>
|
|
|
<!-- End Of Main Contents -->
|
|
|
</div>
|
|
|
@@ -592,8 +633,430 @@ $(document).ready( function() {
|
|
|
|
|
|
let randomNum = Math.floor( ( Math.random() * 4 ) );
|
|
|
$(".it_nav .btn").eq(randomNum).trigger('click');
|
|
|
+
|
|
|
+ // 당신을 위한 제안 쿠키값 확인 (로그인시 확인됨)
|
|
|
+ var pcId = gagajf.getCookie("RB_PCID");
|
|
|
+ // 추천솔루션 API 호출
|
|
|
+ if(!gagajf.isNull(pcId)){
|
|
|
+ fnGetEigenApi(pcId);
|
|
|
+ }
|
|
|
});
|
|
|
|
|
|
+/**
|
|
|
+ * EigenApi
|
|
|
+ * size : 상품수
|
|
|
+ * nh : 키워드수
|
|
|
+ * */
|
|
|
+var fnGetEigenApi = function (id){
|
|
|
+ console.log('[fnGetEigenApi ID]'+id);
|
|
|
+ $.getJSON('https://api.eigene.io/rec/p075?cuid=1252aed4-78dc-46e8-b784-94ac42e86dd4&size=10&nh=10&pcid='+id, function (result,status){
|
|
|
+ console.log('**************');
|
|
|
+ console.log(result);
|
|
|
+ console.log(status);
|
|
|
+ var keywordTag = '';
|
|
|
+ var itemTag = '';
|
|
|
+ var itemTag2 = '';
|
|
|
+ var dataJson;
|
|
|
+
|
|
|
+ if (status === 'success') {
|
|
|
+ if (!gagajf.isNull(result.products) && result.products.length > 0) {
|
|
|
+ $("#keywordArea").html('');
|
|
|
+ $("#recomItemArea").html('');
|
|
|
+ $.each(result.products, function (idx, item) {
|
|
|
+ if (idx == 0 || idx == 5) {
|
|
|
+ keywordTag += '<div class="swiper-slide">\n';
|
|
|
+ keywordTag += ' <ul>\n';
|
|
|
+ }
|
|
|
+ keywordTag += '<li>\n';
|
|
|
+ keywordTag += ' <button class="btn btn_shape active" data-tab="fy' + (idx + 1) + '">\n';
|
|
|
+ keywordTag += ' <div>\n';
|
|
|
+ keywordTag += ' <span class="number">' + (idx + 1) + '</span>\n';
|
|
|
+ keywordTag += ' <span>' + item.sourceId + '</span>\n';
|
|
|
+ keywordTag += ' </div>\n';
|
|
|
+ keywordTag += ' </button>\n';
|
|
|
+ keywordTag += ' <a href="javascript:void(0);" onclick="cfnGoToSearchGoodsListForm(\'' + item.sourceId + '\')">자세히 보기</a>\n';
|
|
|
+ keywordTag += '</li>\n';
|
|
|
+ if (idx == 4 || idx == 9) {
|
|
|
+ keywordTag += ' </ul>';
|
|
|
+ keywordTag += '</div>';
|
|
|
+ }
|
|
|
+
|
|
|
+/*
|
|
|
+ if(idx%2 == 0){
|
|
|
+ itemTag += '<div class="fy_item active" id="fy'+(idx+1)+'">\n';
|
|
|
+ itemTag += ' <div class="part">\n';
|
|
|
+ itemTag += ' <div class="item_prod">\n';
|
|
|
+ itemTag += ' <div class="item_state">\n';
|
|
|
+ itemTag += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag += ' <div class="itemPic">\n';
|
|
|
+ itemTag += ' <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug01.jpg">\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' <div class="itemInfo">\n';
|
|
|
+ itemTag += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag += ' <div class=" itemName">자카드 방풍 패딩 스웨터 가디건 자카드</div>\n';
|
|
|
+ itemTag += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </a>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' <div class="item_prod">\n';
|
|
|
+ itemTag += ' <div class="item_state">\n';
|
|
|
+ itemTag += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag += ' <div class="itemPic">\n';
|
|
|
+ itemTag += ' <img alt="BLACK-a" className=" vLHTC pd_img" src="/images/pc/thumb/main_sug02.jpg">\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' <div class="itemInfo">\n';
|
|
|
+ itemTag += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag += ' <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>\n';
|
|
|
+ itemTag += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </a>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' <div class="part lg">\n';
|
|
|
+ itemTag += ' <div class="item_prod">\n';
|
|
|
+ itemTag += ' <div class="item_state">\n';
|
|
|
+ itemTag += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag += ' <div class="itemPic">\n';
|
|
|
+ itemTag += ' <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug03.jpg">\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' <div class="itemInfo">\n';
|
|
|
+ itemTag += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag += ' <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 </div>\n';
|
|
|
+ itemTag += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </a>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' <div class="part">\n';
|
|
|
+ itemTag += ' <div class="item_prod">\n';
|
|
|
+ itemTag += ' <div class="item_state">\n';
|
|
|
+ itemTag += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag += ' <div class="itemPic">\n';
|
|
|
+ itemTag += ' <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug04.jpg">\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' <div class="itemInfo">\n';
|
|
|
+ itemTag += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag += ' <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 </div>\n';
|
|
|
+ itemTag += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </a>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' <div class="item_prod">\n';
|
|
|
+ itemTag += ' <div class="item_state">\n';
|
|
|
+ itemTag += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag += ' <div class="itemPic">\n';
|
|
|
+ itemTag += ' <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug05.jpg">\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' <div class="itemInfo">\n';
|
|
|
+ itemTag += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag += ' <div class=" itemName">남성 로고 자카드 방풍 패딩 가디건</div>\n';
|
|
|
+ itemTag += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </a>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' <div class="part">\n';
|
|
|
+ itemTag += ' <div class="item_prod">\n';
|
|
|
+ itemTag += ' <div class="item_state">\n';
|
|
|
+ itemTag += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag += ' <div class="itemPic">\n';
|
|
|
+ itemTag += ' <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug06.jpg">\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' <div class="itemInfo">\n';
|
|
|
+ itemTag += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag += ' <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 </div>\n';
|
|
|
+ itemTag += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </a>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' <div class="item_prod">\n';
|
|
|
+ itemTag += ' <div class="item_state">\n';
|
|
|
+ itemTag += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag += ' <div class="itemPic">\n';
|
|
|
+ itemTag += ' <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug07.jpg">\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' <div class="itemInfo">\n';
|
|
|
+ itemTag += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag += ' <div class=" itemName">남성 로고 자카드 방풍 패딩 가디건 자카드 방풍 패딩 스웨터 가디건</div>\n';
|
|
|
+ itemTag += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </a>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += ' </div>\n';
|
|
|
+ itemTag += '</div>\n';
|
|
|
+ }else{
|
|
|
+ itemTag2 += '<div class="fy_item" id="fy2">\n';
|
|
|
+ itemTag2 += ' <div class="part">\n';
|
|
|
+ itemTag2 += ' <div class="item_prod">\n';
|
|
|
+ itemTag2 += ' <div class="item_state">\n';
|
|
|
+ itemTag2 += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag2 += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag2 += ' <div class="itemPic">\n';
|
|
|
+ itemTag2 += ' <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug04.jpg">\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' <div class="itemInfo">\n';
|
|
|
+ itemTag2 += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag2 += ' <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 </div>\n';
|
|
|
+ itemTag2 += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </a>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' <div class="item_prod">\n';
|
|
|
+ itemTag2 += ' <div class="item_state">\n';
|
|
|
+ itemTag2 += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag2 += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag2 += ' <div class="itemPic">\n';
|
|
|
+ itemTag2 += ' <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug05.jpg">\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' <div class="itemInfo">\n';
|
|
|
+ itemTag2 += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag2 += ' <div class=" itemName">남성 로고 자카드 방풍 패딩 가디건</div>\n';
|
|
|
+ itemTag2 += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </a>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' <div class="part">\n';
|
|
|
+ itemTag2 += ' <div class="item_prod">\n';
|
|
|
+ itemTag2 += ' <div class="item_state">\n';
|
|
|
+ itemTag2 += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag2 += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag2 += ' <div class="itemPic">\n';
|
|
|
+ itemTag2 += ' <img alt="BLACK-a" className=" vLHTC pd_img" src="/images/pc/thumb/main_sug01.jpg">\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' <div class="itemInfo">\n';
|
|
|
+ itemTag2 += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag2 += ' <div class=" itemName">자카드 방풍 패딩 스웨터 가디건 자카드</div>\n';
|
|
|
+ itemTag2 += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </a>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' <div class="item_prod">\n';
|
|
|
+ itemTag2 += ' <div class="item_state">\n';
|
|
|
+ itemTag2 += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag2 += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag2 += ' <div class="itemPic">\n';
|
|
|
+ itemTag2 += ' <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug02.jpg">\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' <div class="itemInfo">\n';
|
|
|
+ itemTag2 += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag2 += ' <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건</div>\n';
|
|
|
+ itemTag2 += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </a>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' <div class="part">\n';
|
|
|
+ itemTag2 += ' <div class="item_prod">\n';
|
|
|
+ itemTag2 += ' <div class="item_state">\n';
|
|
|
+ itemTag2 += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag2 += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag2 += ' <div class="itemPic">\n';
|
|
|
+ itemTag2 += ' <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug06.jpg">\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' <div class="itemInfo">\n';
|
|
|
+ itemTag2 += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag2 += ' <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 </div>\n';
|
|
|
+ itemTag2 += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </a>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' <div class="item_prod">\n';
|
|
|
+ itemTag2 += ' <div class="item_state">\n';
|
|
|
+ itemTag2 += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag2 += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag2 += ' <div class="itemPic">\n';
|
|
|
+ itemTag2 += ' <img alt="BLACK-a" className=" vLHTC pd_img" src="/images/pc/thumb/main_sug07.jpg">\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' <div class="itemInfo">\n';
|
|
|
+ itemTag2 += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag2 += ' <div class=" itemName">남성 로고 자카드 방풍 패딩 가디건 자카드 방풍 패딩 스웨터 가디건 </div>\n';
|
|
|
+ itemTag2 += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </a>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' <div class="part lg">\n';
|
|
|
+ itemTag2 += ' <div class="item_prod">\n';
|
|
|
+ itemTag2 += ' <div class="item_state">\n';
|
|
|
+ itemTag2 += ' <button type="button" class="itemLike" tabIndex="0">관심상품 추가</button>\n';
|
|
|
+ itemTag2 += ' <a href="#none" class="itemLink" tabIndex="0">\n';
|
|
|
+ itemTag2 += ' <div class="itemPic">\n';
|
|
|
+ itemTag2 += ' <img alt="BLACK-a" class=" vLHTC pd_img" src="/images/pc/thumb/main_sug03.jpg">\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' <div class="itemInfo">\n';
|
|
|
+ itemTag2 += ' <p class="itemBrand">BRAND NAME</p>\n';
|
|
|
+ itemTag2 += ' <div class=" itemName">남성 로고 자카드 방풍 패딩 스웨터 가디건 자카드 방풍 패딩 스웨터 가디건 </div>\n';
|
|
|
+ itemTag2 += ' <p class="itemPrice">80,100</p>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </a>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += ' </div>\n';
|
|
|
+ itemTag2 += '</div>\n';
|
|
|
+ }
|
|
|
+ */
|
|
|
+ // if((idx > 0 && idx % 4 == 0) || result.products.length == (idx)){
|
|
|
+ // }
|
|
|
+ });
|
|
|
+ $("#keywordArea").append(keywordTag);
|
|
|
+ $("#recomItemArea").append(itemTag);
|
|
|
+
|
|
|
+ /* SLIDE - MAIN_RECOMM */
|
|
|
+ //MAIN_RECOMM_키워드 탭
|
|
|
+ $(".main_recomm .tag_list .btn").click(function () {
|
|
|
+ var recommActive = $(this).attr('data-tab');
|
|
|
+ $(".main_recomm .tag_list .btn").removeClass('active');
|
|
|
+ $(".main_recomm .tagitem").removeClass('active');
|
|
|
+ $(this).addClass('active');
|
|
|
+ $('#' + recommActive).addClass('active');
|
|
|
+ });
|
|
|
+
|
|
|
+ function init() {
|
|
|
+
|
|
|
+ if (main_recomm_slide != null) main_recomm_slide.destroy();
|
|
|
+
|
|
|
+ var main_recomm_slide = new Swiper('.main_recomm .post-recomm', {
|
|
|
+ slidesPerView: 5,
|
|
|
+ slidesPerGroup: 5,
|
|
|
+ speed: 1000,
|
|
|
+ spaceBetween: 20,
|
|
|
+ loop: true,
|
|
|
+ a11y: {
|
|
|
+ enabled: true,
|
|
|
+ notificationClass: 'swiper-notification',
|
|
|
+ prevSlideMessage: '이전 슬라이드',
|
|
|
+ nextSlideMessage: '다음 슬라이드',
|
|
|
+ paginationBulletMessage: '슬라이드 {{index}}로 이동',
|
|
|
+ },
|
|
|
+ pagination: {
|
|
|
+ el: '.main_recomm .swiper-pagination',
|
|
|
+ clickable: true,
|
|
|
+ },
|
|
|
+ navigation: {
|
|
|
+ nextEl: '.main_recomm .swiper-button-next',
|
|
|
+ prevEl: '.main_recomm .swiper-button-prev',
|
|
|
+ },
|
|
|
+ observer: true,
|
|
|
+ observeParents: true,
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ init();
|
|
|
+
|
|
|
+ /* SLIDE - MAIN_FORYOU */
|
|
|
+ var cntNum = 0;
|
|
|
+ var main_foryou_slide = new Swiper('.main_foryou .post-sug .swiper-container', {
|
|
|
+ allowTouchMove: false,
|
|
|
+ loop: false,
|
|
|
+ effect: 'fade',
|
|
|
+ autoHeight: false,
|
|
|
+ autoplay: {
|
|
|
+ delay: 25000,
|
|
|
+ disableOnInteraction: false,
|
|
|
+ },
|
|
|
+ a11y: {
|
|
|
+ enabled: true,
|
|
|
+ notificationClass: 'swiper-notification',
|
|
|
+ prevSlideMessage: '이전 슬라이드',
|
|
|
+ nextSlideMessage: '다음 슬라이드',
|
|
|
+ paginationBulletMessage: '슬라이드 {{index}}로 이동',
|
|
|
+ },
|
|
|
+ pagination: {
|
|
|
+ el: '.post-sug .swiper-pagination',
|
|
|
+ clickable: true,
|
|
|
+ },
|
|
|
+ on: {
|
|
|
+ slideChange: function () {
|
|
|
+ $(".fy_nav .swiper-slide li").children('.btn_shape').removeClass('active');
|
|
|
+ $(".fy_nav .swiper-slide-next li").eq(0).children('.btn_shape').addClass('active');
|
|
|
+ $(".fy_nav .swiper-slide-prev li").eq(0).children('.btn_shape').addClass('active');
|
|
|
+ foryouIndex = -1;
|
|
|
+ if (cntNum === 0) {
|
|
|
+ $('.fy_item').removeClass('active');
|
|
|
+ $('#fy6').addClass('active');
|
|
|
+ cntNum = 1;
|
|
|
+ } else {
|
|
|
+ $('.fy_item').removeClass('active');
|
|
|
+ $('#fy1').addClass('active');
|
|
|
+ cntNum = 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ clearInterval(ti);
|
|
|
+ ti = startTimeInterval();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ });
|
|
|
+
|
|
|
+ function foryouInterval(_foryouIndex) {
|
|
|
+ var foryouCateItems = $(".main_foryou .fy_nav .swiper-slide-active ul li .btn_shape");
|
|
|
+ $(foryouCateItems[(_foryouIndex + 1) % 5]).addClass("active");
|
|
|
+ $(foryouCateItems[_foryouIndex % 5]).removeClass("active");
|
|
|
+ }
|
|
|
+
|
|
|
+ function foryouFy_item(_Fy_itemIndex) {
|
|
|
+ var fynavItems = $('.main_foryou .fy_nav .swiper-slide-active ul li .btn_shape.active');
|
|
|
+ var fyActive = $(fynavItems).attr('data-tab');
|
|
|
+ // $(".fy_nav .btn_shape").removeClass('active');
|
|
|
+ $(".fy_item").removeClass('active');
|
|
|
+ // $(".fy_item").addClass('active');
|
|
|
+ $('#' + fyActive).addClass('active');
|
|
|
+ }
|
|
|
+
|
|
|
+ var foryouIndex = 0;
|
|
|
+ var ti;
|
|
|
+
|
|
|
+ function startTimeInterval() {
|
|
|
+ return setInterval(function () {
|
|
|
+ $(".fy_nav .btn_shape").removeClass('active');
|
|
|
+ $(".fy_item").removeClass('active');
|
|
|
+ foryouInterval(foryouIndex);
|
|
|
+ foryouFy_item();
|
|
|
+ if (foryouIndex >= 5) foryouIndex = 0;
|
|
|
+ foryouIndex++;
|
|
|
+ }, 5000);
|
|
|
+ }
|
|
|
+
|
|
|
+ $(".fy_nav .btn_shape").click(function () {
|
|
|
+ var fyActive = $(this).attr('data-tab');
|
|
|
+ $(".fy_nav .btn_shape").removeClass('active');
|
|
|
+ $(".fy_item").removeClass('active');
|
|
|
+ $(this).addClass('active');
|
|
|
+ $('#' + fyActive).addClass('active');
|
|
|
+ });
|
|
|
+
|
|
|
+ $(".fy_nav ul li").click(function () {
|
|
|
+ foryouIndex = $(this).index();
|
|
|
+ clearInterval(ti);
|
|
|
+ ti = startTimeInterval();
|
|
|
+ });
|
|
|
+
|
|
|
+ ti = startTimeInterval();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
/* SLIDE - MAIN_VISUAL */
|
|
|
var agent = navigator.userAgent.toLowerCase();
|
|
|
|
bin2107