탭메뉴 링크 클릭시 화면 스크롤 부드럽게 처리
페이지 정보
작성자 JMStudy 작성일17-09-08 17:25 조회7,050회 댓글0건본문
$('.pg-anc a').on('click', function(e) {
//e.stopPropagation();
var scrollTopSpace;
if (window.innerWidth >= 1100) {
scrollTopSpace = 70;
} else {
scrollTopSpace = 70;
}
var tabLink = $(this).attr('href');
var offset = $(tabLink).offset().top;
$('html, body').animate({scrollTop : offset - scrollTopSpace}, 500);
return false;
});
<div id="anc_1">
<div class="pg-anc">
<ul class="tabs">
<li><a href="#anc_1" class="active">탭메뉴1</a></li>
<li><a href="#anc_2">탭메뉴2</a></li>
<li><a href="#anc_3">탭메뉴3</a></li>
</ul>
</div>
<div>내용1</div>
</div>
<div id="anc_2">
<div class="pg-anc">
<ul class="tabs">
<li><a href="#anc_1">탭메뉴1</a></li>
<li><a href="#anc_2" class="active">탭메뉴2</a></li>
<li><a href="#anc_3">탭메뉴3</a></li>
</ul>
</div>
<div>내용2</div>
</div>
<div id="anc_3">
<div class="pg-anc">
<ul class="tabs">
<li><a href="#anc_1">탭메뉴1</a></li>
<li><a href="#anc_2">탭메뉴2</a></li>
<li><a href="#anc_3" class="active">탭메뉴3</a></li>
</ul>
</div>
<div>내용3</div>
</div>
댓글목록
등록된 댓글이 없습니다.