navigator.platform은 현재 사용 중인 플랫폼(운영 체제)을 가져오는 데 사용되지만, 이 속성은 deprecated 되었습니다. 대신에 사용할 수 있는 대안으로는 navigator.userAgent 속성을 활용하는 방법이 있습니다. navigator.userAgent는 현재 브라우저에 대한 사용자 에이전트 문자열을 반환합니다. 이 문자열에는 사용 중인 운영 체제에 대한 정보도 포함되어 있으므로, 이를 분석하여 플랫폼 정보를 가져올 수 있습니다. var userAgent = navigator.userAgent; var mobileDevices = ["Android", "webOS", "iPhone", "iPad", "iPod", "BlackBerry", "Windows Phone"]; var ..
URLSearchParams는 웹 API 중 하나로, URL의 쿼리 문자열을 쉽게 다룰 수 있도록 도와주는 인터페이스 var urlParams = new URLSearchParams(window.location.search); //https://example.com/page?param1=value1¶m2=value2¶m3=value3 console.log(urlParams.get('param1')); // 출력: "value1" console.log(urlParams.get('param2')); // 출력: "value2" console.log(urlParams.get('param3')); // 출력: "value3" 기능 기존 쿼리 문자열을 키-값 쌍으로 파싱합니다. 키-값 쌍으로 새로운..
const options = { // null을 설정하거나 무엇도 설정하지 않으면 브라우저 viewport가 기준이 된다. root: null, // 타겟 요소의 20%가 루트 요소와 겹치면 콜백을 실행한다. threshold: 0.2 } // Intersection Observer 인스턴스 const observer = new IntersectionObserver(function(entries,observer) { entries.forEach(entry => { // 루트 요소와 타겟 요소가 교차하면 dataset에 있는 이미지 url을 타겟요소의 src 에 넣어준다. if (entry.isIntersecting) { //타겟 요소의 src 속성의 값을 dataset 의 이미지 url 로 교체 entr..
jQuery를 사용하여 특정 selector 위치로 스크롤 이동시키기 const selectorTop = $('selector').offset().top; // selector 좌표 top const headerHeight = $('.header').height; // 제외할 헤더 높이 $('html, body').stop().animate({scrolltop : selectorTop - headerHeight}); // 스크롤 이동 JavaScript로도 구현 가능 document.gelElementById('id').scrollIntoView({behavior:"smooth"}); //IE, Safari behavior 옵션 사용 불가
What? javascript 에서 날짜/시간을 계산할 때 사용하는 Date()는 Client Local Time 이기 때문에 디바이스, 네트워크 등 환경에 따라 차이가 있다. Timer, Count Down 서비스 구현 시 서버 시간 기준으로 구현하려면 서버 시간을 동기화 해야하는데 1초마다 서버 시간을 동기화하는 것은 비효율적이다. Solution 최초에 서버 시간을 불러와서 Local Time 과 차이를 계산해두고, 1초마다 시간을 계산할 때 Local Time에 차이값을 추가하여 계산해주면 서버 시간과 차이를 보정할 수 있다. 서버 시간을 받아오는 네트워크 시간에 차이가 있기 때문에 1~2초 오차가 날 수 있다. const serverTime = [서버에서 가져온 시간]; const gabTime..
동적으로 추가된 HTML 태그에도 영향 &(document).off();