728x90
반응형
$('.tabmenu ul li a').on('click', function(){
//메뉴 중에 하나를 클릭하면
$('.tabmenu ul li').removeClass('on'); // 전체 on 삭제
$(this).parent().addClass('on'); // 선택된 부모 li에게 on 부여
var left = $('.tabmenu ul li.on').offset().left;
//on이 부여된 li 의 위치 (스크롤된 상태 기준으로 계산됨)
var curLeft = $('.tabmenu').scrollLeft();
//현재 스크롤 위치
$('.tabmenu').animate({scrollLeft : curLeft+left}, 400);
//400ms 동안 scrollLeft의 위치를 (curLeft + left) 로 변경함
});
728x90
반응형
'javascript > jQuery' 카테고리의 다른 글
jquery ui - datepicker css 변경해 디자인 적용하기 (1058) | 2022.08.31 |
---|---|
[jquery플러그인]마우스로 배경이미지에 물결을 일으키는 효과를 주는 water-ripple 플러그인 (378) | 2019.07.05 |
[jQuery]모달창 만들기 (429) | 2019.06.20 |
[jQuery UI]리스트 순서 정렬하기 sortable (282) | 2019.06.20 |
[jQuery UI]resizable 크기조절 가능하게 하기 (407) | 2019.06.20 |
댓글