본문 바로가기
728x90
300x250

javaScript/JS Examples47

Scrollspy 스크롤 스파이란? 스크롤스파이 메뉴 예제 Scrollspy란? 탐색 메뉴가 페이지를 스크롤할 때 사용자가 보고 있는 페이지의 현재 섹션을 강조 표시할 수 있는 웹 개발 기능을 말한다. jQuery 예시 스크롤 하면 현재 페이지 섹션에 해당하는 메뉴 색상이 변경 된다. $(document).ready(function() { $(window).scroll(function() { var currentSection = null; $('section').each(function() { var sectionTop = $(this).offset().top - 50; if ($(window).scrollTop() >= sectionTop) { currentSection = $(this).attr('id'); } }); $('nav li').removeClas.. 2023. 5. 7.
[javaScript]스타일 속성 접근하기 인라인/내부/외부 스타일 스타일 가져오기 실행결과 인라인 스타일 속성을 가져올 경우 style 속성을 이용하면 된다. 만약 내부 / 외부 스타일에 있는 스타일 속성을 가져올 경우에는 window.getComputedStyle 메서드를 이용해야 한다. 2023. 2. 10.
[javaScript] 아이폰일 경우에만 적용 스크립트 var UserAgent = navigator.platform; if(UserAgentAgent.match(/i(Phone|Pod|Pad)/i) != null){ // 아이폰일 경우에만 적용되는 코드 } 2022. 7. 26.
javaScript 간단하게 변수의 빈값 체크해 유효성 검사하기 변수에 값이 빈 값인지 체크하기 위해서는 if문을 이용해서 null인지 undefined 인지 확인을 해주면 된다. let data = ''; if(data === undefined || data === null || data ==='') { console.log('값이 없습니다.'); } 그러나 위에 같이 일일이 undefined이거나 null이거나 할 필요 없이 간단하게 유효성 검사를 하 할 수 있다. 바로 ! NOT연산자를 이용해서 간단하게 유효성 검증이 가능하다. !을 이용할 경우 값이 있으면 false 값이 없으면 true를 반환한다. let data = ''; if(!data) { console.log('값이 없습니다.'); } 즉 값이 undefined || null || '' || 0 ||.. 2022. 5. 28.
728x90
반응형