FAQ 스크립트
페이지 정보
작성일 23-06-09 17:42
본문
<ol class="ol_faq_con ol_faq_con-1"><!-- ol_faq_con ol_faq_con-1 : s --> <li class="li_faq_con li_faq_con0 li_faq_click_h3" data-idx="0" data-fm_id="1" data-fa_id="1"><!-- li_faq_con li_faq_con0 li_faq_click_h3 : s --> <h3 class="h3_faq_con h3_faq_con0" data-idx="0"> <span class="tit_bg tit_bg_questions">Q</span> <a href="#none_0_1_1" class="a_faq_con a_faq_con0" data-idx="0">회원가입 안내</a> </h3> <div class="con_inner con_inner0" style="display: none;"><!-- con_inner con_inner0 : s --> <span class="tit_bg tit_bg_answer">A</span> <p>메뉴를 통해 이용약관</p> <div class="con_closer con_closer0"><!-- con_closer con_closer0 : s --> <button type="button" class="closer_btn closer_btn0 btn_b03" data-idx="0">닫기</button> </div><!-- con_closer con_closer0 : e --> </div><!-- con_inner con_inner0 : e --> </li><!-- li_faq_con li_faq_con0 li_faq_click_h3 : e --> <li class="li_faq_con li_faq_con1 li_faq_click_h3" data-idx="1" data-fm_id="1" data-fa_id="1"><!-- li_faq_con li_faq_con1 li_faq_click_h3 : s --> <h3 class="h3_faq_con h3_faq_con1" data-idx="1"> <span class="tit_bg tit_bg_questions">Q</span> <a href="#none_1_1_1" class="a_faq_con a_faq_con1" data-idx="1">회원가입 안내222</a> </h3> <div class="con_inner con_inner1" style="display: none;"><!-- con_inner con_inner1 : s --> <span class="tit_bg tit_bg_answer">A</span> <p>메뉴를 통해 이용약22</p> <div class="con_closer con_closer1"><!-- con_closer con_closer1 : s --> <button type="button" class="closer_btn closer_btn1 btn_b13" data-idx="1">닫기</button> </div><!-- con_closer con_closer1 : e --> </div><!-- con_inner con_inner1 : e --> </li><!-- li_faq_con li_faq_con1 li_faq_click_h3 : e --> </ol>
function faq_open(sThis) { var idx = $(sThis).attr('data-idx'); var $con = $(sThis).closest('li').find('.con_inner'); var $h3 = $(sThis).closest('li').find('h3') var console_log = ''; console_log += 'faq idx : '+idx; if($con.is(':visible')) { console_log += '\n'; console_log += 'faq slideUp : '+$con.is(':visible'); console_log += '\n'; console_log += 'faq display : none'; $h3.removeClass('faq_li_open'); $con.slideUp(); } else { console_log += '\n'; console_log += 'faq slideDown : '+$con.is(':visible'); console_log += '\n'; console_log += 'faq display : block'; $('.skin_faq_container li.li_faq_con .con_inner:visible').hide(); $con.slideDown( function() { // image resize $con.viewimageresize2(); $('.skin_faq_container li.li_faq_con h3').removeClass('faq_li_open'); $h3.addClass('faq_li_open'); console_log += '\n'; console_log += 'faq viewimageresize2'; } ); } if( g5_cma_my_off == 'y' || g5_cma_my_user == 'y' ) { console.log(console_log); } return false; } function faq_close(sThis) { var idx = $(sThis).attr('data-idx'); $(sThis).closest('.con_inner').slideToggle('slow', function() { var $h3 = $(sThis).closest('li').find('h3'); $('.skin_faq_container li.li_faq_con h3').removeClass('faq_li_open'); if( $(sThis).is(':visible')) { $h3.addClass('faq_li_open'); } }); return false; }
$(function(e) { $(document).on('click', '.skin_faq_container .con_closer .closer_btn', function(e){ faq_close(this); }); $(document).on('click', '.skin_faq_container li.li_faq_click_h3 h3.h3_faq_con', function(e){ faq_open(this); }); $(document).on('click', '.skin_faq_container li.li_faq_click_a h3.h3_faq_con a.a_faq_con', function(e){ faq_open(this); }); });
추천 0 비추천 0
- 이전글 click(), focusin() 이벤트 충돌 : blur, focusout 처리전에 click이벤트 발생시키기 23.06.17
- 다음글 jquery element 의 hide 여부 판단 하기 23.05.13