본문 바로가기
728x90
반응형

javascript71

특정 영역으로 스크롤 이동하기 (offset().top 안먹힐 때) 원래 $(#section1).offset().top으로 해당 영역의 시작 위치를 알 수 있어서 아래와 같이 페이지 이동이 가능하다 var section1Top = $("#section1").offset().top; $("#container").animate({ scrollTop: 0 }, section1Top ); 그런데 이게 안되는 경우가 있다 섹션의 영역이 고정이 아닌경우 offset().top 의 값이 계속 바뀐다 이럴때 쓸 수 있는 방법! var section1Top = $("#section1")[0].offsetTop; $("#container").animate({ scrollTop: 0 }, section1Top ); 이렇게 코드를 바꾸면 해결된다! 2024. 2. 19.
[ScollLeft()] 모바일 메뉴 좌우스크롤에서 선택된 메뉴 쪽으로 스크롤 되도록 하기 $('.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의 위치를 (curLe.. 2022. 9. 13.
체크박스 input[type="checkbox"] 전체 체크 구현 이벤트 리스너를 등록해 전체 체크의 값이 변하면 나머지도 같이 바꿔준다 checkAll.addEventListener('change', function () { check1.checked = checkAll.checked; check2.checked = checkAll.checked; check3.checked = checkAll.checked; }); 전체 체크 이외의 체크박스 값이 변하는걸 감지해서 전체가 true가 아닐경우 가 해제 되도록 한다 check.addEventListener('change', function () { if (check1.checked && check2.checked && check3.checked) { checkAll.checked = true; } else { check.. 2022. 9. 5.
시간 계산(몇분전, 몇일전, 몇년전..) //현재시간 var now = new Date(); //기준시간 var writeDay = new Date(time); //현재 시간과 기준시간의 차이를 getTime을 통해 구한다 var difference = now.getTime() - writeDay.getTime(); //초로 바꿔준다 difference = Math.trunc(difference / 1000); 기준점을 만든다 // 초 const seconds = 1; // 분 const minute = seconds * 60; // 시 const hour = minute * 60; // 일 const day = hour * 24; // 달 const mon = day * 30; // 년 const year = mon * 12; differen.. 2022. 9. 5.
728x90
반응형