본문 바로가기

Web62

[JS - Plugin] Scroll Masic 라이센스 : [MIT] License 공식문서 : http://scrollmagic.io/docs ScrollMagic Documentation Quicklinks: About | Download | Installation | Usage | Help | Compatibility | Author | License | Thanks ScrollMagic helps you to easily react to the user's current scroll position. It's the perfect library for you, if you want to ... animate based on scroll scrollmagic.io 한눈에 보는 Cheat Sheet 스크롤매직을 제대로 활용하려면 doc문서를 참고.. 2019. 12. 13.
[javascript] 이벤트 핸들러 1번만 적용하고 제거하기 기본적인 이벤트 핸들러의 선언 및 제거방법 //실행 될 이벤트 function test(){} 이벤트 핸들러 선언 element.addEventListener("click", test); 이벤트 핸들러 제거 element.removeEventListener("click", test); 익명함수를 콜백으로 쓰게 될 경우엔 element.addEventListener("click", function(){ test(); // 선언한 클릭이벤트가 전부 제거 되어버림 this.removeEventListener("click"); // arguments.callee 를 사용하면 원하는 이벤트만 제거 this.removeEventListener("click",arguments.callee); }); 활용 예) 비디오.. 2019. 12. 12.
[javascript] 브라우저 IE 감지 ie 브라우저로 접속 시에만 결과값이 보인다. 크로스브라우징 이슈가 있을 경우 브라우저 판단 후 body태그에 class를 추가해주면 css 작업시 편해진다. See the Pen IE 감지 by juein (@juein) on CodePen. 2019. 12. 12.
[javascript] 자주 사용하는 정규식 메모 자주 쓰는 정규식 //숫자 3단위마다 콤마 찍기 var numberWithCommas= function(num){ return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); } // 아이디 체크 정규식 const regExpId = /^[a-z0-9_-]\w{5,20}$/; // 비밀번호 길이 체크 정규식 const regExpPassword = /^\w[6,16]$/; // 비밀번호 조합(영문, 숫자) 및 길이 체크 정규식 const regExpPassword = /^(?=.*[a-zA-Z])(?=.*[0-9]).{6,16}$/; // 이메일 체크 정규식 const regExpEmail=/^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.).. 2019. 10. 7.
[javascript] Math.random 을 사용한 난수 생성 shuffleRandom 함수가 전달받은 매개변수 n 개 만큼 배열을 생성 & 값을 섞어서 난수를 발생하는 방법 See the Pen js 난수 - Math.random() by juein (@juein) on CodePen. 2019. 10. 7.
[React] create-react-app 작업 내용을 build 하기 빌드를 하면 react 소스를 js 소스로 변환할 수 있다. 즉 NodeJs / React가 구축되어있지 않은 환경에서 동작도 되고, 소스 압축도 해준다. 빌드 하는 방법은 매우 간단하다. 먼저 package.json 파일 하단에 "homepage" : "원하는 경로" 를 적어준다. homepage 에 대한 안내 설명은 하단 링크를 참고한다. https://github.com/facebook/create-react-app/blob/master/docusaurus/docs/deployment.md#building-for-relative-paths 나는 상대경로를 사용하기 위해 "homepage": "./", 로 설정하였다. 경로 설정 후 yarn build 명령어를 입력하면 끝이다. 빌드가 끝나면 프로젝트.. 2019. 7. 16.