j쿼리 탭롤링에서 li숨김 코드좀 찾아주세요
본문
;(function($) {
$.fn.tabs = function(options) {
// 옵션 설정.
options = $.extend({
start_index: 1,
random: false,
transitions_time: 400
}, options);
// jQuery 체인.
return this.each(function() {
// 대상 참조.
var $this = $(this),
$menu = $this.find('.tab_menu'),
$menu_li = $menu.find('li'),
$menu_a = $menu_li.find('a'),
$contents = $this.find('.tab_contents'),
support_features = !Modernizr.opacity || !Modernizr.csstransitions;
// 랜덤 인덱스 설정.
if(options.random)
options.start_index = Math.floor(Math.random() * $menu_li.length + 1);
// 플러그인 대상 객체에 클래스 부여
$this.addClass('tabs');
// 처음 보여질 탭 설정.
$menu.add($contents)
.find('li:nth-child(' + options.start_index + ')').addClass('active');
// opacity 미지원 브라우저에 적용.
if(support_features) {
$menu_li.find('img').animate({'opacity': 0}, 10, function() {
$menu_li.filter('.active').find('img').animate({'opacity': 1}, 10);
});
$menu_a
.mouseover(function() {
$(this)
.stop().animate({'padding-left': '2.2em', 'padding-right': '0.8em'}, 200)
.find('img').stop().animate({'opacity': 1, 'left': 6}, 200);
})
.mouseout(function() {
if($(this).parent().hasClass('active')) return false;
$(this)
.stop().animate({'padding-left': '1.5em', 'padding-right': '1.5em'}, 200)
.find('img').stop().animate({'opacity':0, 'left': 16}, 200);
});
};
// $menu 내부의 a 클릭 시 이벤트 핸들링
$menu_a.click(function(e) {
// 대상 참조.
var $this = $(this),
target = $this.attr('href');
// 활성화된 a 클릭 시, 작동하지 않도록 설정.
if($this.parent().hasClass('active')) return;
// $menu_link에서 active 클래스 제거
$menu_li.removeClass('active');
// 클릭한 a의 부모 li에 active 클래스 추가
$this.parent().addClass('active');
// opacity 미지원 브라우저에 적용.
if(support_features) {
$menu_li.not('.active').find('a').mouseout();
$(this).mouseover();
};
// 부드러운 장면전환.
$contents.find('li')
.fadeTo(options.transition_time, 0, function() {
$(this).removeClass('active')
.filter(target).addClass('active').fadeTo(options.transition_time, 1);
});
// 브라우저 링크 기본 동작 차단
e.preventDefault();
});
}); // end: return
}; //end: plug-in
})(jQuery);
이렇게 되어있는 JS파일입니다.
<div class="tab_contents">
안에 있는 <li>코드를 숨김 해놓는 건데..
문제는 li 안에 있는 ul li도 같이 숨겨버립니다.
여기까지는 원래 맞는데
표시하기를 하면 li안에 있는 li는 표시가 안됩니다..
어떻게 해야 할까요 ㅠㅠ
!-->
답변을 작성하시기 전에 로그인 해주세요.