개발자의 끄적끄적

[javascript/jquery] javascript pixelate library [링크] javascript 를 사용하다보면 이미지를 다뤄야 하는 경우가 종종 있습니다. 그중에서 이미지를 픽셀화 해서 흐릿하게 변경되는 이벤트를 주어야 하는 경우가 있는데요. 그럴때는 아래 나와있는 pixelate 를 사용하시면 됩니다! 아래 링크 들어가셔서 한번 보시면 바로 이해하실껍니다! 참고들 하세요! javascript pixelate library : https://github.com/miguelmota/pixelate GitHub - miguelmota/pixelate: Pixelate an image with canvas. Pixelate an image with canvas. Contribute to m..

[javascript/jquery] jquery 모션 그래픽 라이브러리 mo.js [링크] javascript 를 사용하다보면 모션그래픽에 관련된 플러그인이 필요한 경우가 있습니다! 인터렉션이 많은 페이지의 경우 요구될 가능성이 많은데요 그럴때는 jquery 플러그인중 하나인 mo.js 를 이용하시면 됩니다! 아래 링크 달아 놓을테니 들어가셔서 한번 확인해보시고 금방 적용하실 겁니다! 참고들 하세요! jquery 모션 그래픽 라이브러리 mo.js : https://github.com/mojs/mojs GitHub - mojs/mojs: The motion graphics toolbelt for the web The motion graphics toolbelt for the web. Contribute t..

[javascript/jquery] javascript facebook share example / 자바스크립트 페이스북 공유하기 스크립트 javascript 에서 게시물을 다루다 보면 컨텐츠를 sns 공유하기 위한 버튼을 구성하는 경우가 있습니다. 그중에서 facebook 공유하기 스크립트를 공유하고자 합니다. https://www.facebook.com/sharer/sharer.php?u=PAGE_URL 공유하기 버튼에 위 링크를 href 로 넣으면 페이스북 페이지가 열러 로그인 및 공유할 수 있는 화면으로 전환 됩니다. 참고들 하세요!

[javascript/jquery] javascript 한글 숫자 영문만 허용하는 정규식 javascript 에서 입력값을 다루다보면, 한글, 영문, 숫자만 입력받아야 하는 경우가 있습니다. 아래나와있는 정규식을 이용하시면, 한글, 영문, 숫자만 입력되었는지 체크할 수 있습니다! var regex = /^[ㄱ-ㅎ|가-힣|a-z|A-Z|0-9|\*]+$/; 참고들 하세요!

[javascript/jquery] javascript 영문과 숫자만 허용하는 정규식 javascript 에서 아이디 같은 부분의 입력값을 체크할때, 영문이나 숫자만 입력을 받아야 하는 경우가 있습니다. 그럴때는 아래 나와있는 정규식을 이용하시면 됩니다. var regex = /^[A-Za-z0-9+]*$/; 추가적으로 영문이나 숫자만 입력을 받지만, 6~12 자리만 입력을 받으려면 아래와 같이 추가해서 사용하시면 됩니다! var regex = /^[A-Za-z0-9+]{6,12}$/; 참고들 하세요!

[javascript/jquery] javascript remove eventlistner example / 자바스크립트 이벤트 리스너 제거하는 방법 javascript 에서 이벤트를 제어하기 위해서 이벤트 리스너를 사용하다보면 등록된 이벤트 리스너를 제거해야 하는 경우도 생깁니다. 그럴때는 아래나와있는 removeEventListner 를 사용하시면 됩니다. removeEventListener() 사용법이랑 설명이 잘 정리되어 있는 사이트가 있어서 링크 달아놓을테니 들어가셔서 한번 확인해보세요! event listner 정리된 사이트 : https://hianna.tistory.com/494 [Javascript] 이벤트 추가, 제거하기 이번에는 element에 이벤트를 추가, 삭제 하는 방법을 정리해..

[javascript/jquery] jquery datatable Cannot reinitialise 에러 해결 방법 jquery datatable 을 이용하다 보면 여러가지 에러들이 나곤 합니다. 그중에서 Cannot reinitialise 이런 에러가 나는 경우에는 이미 한번 초기화 된 제이쿼리가 한번더 초기화 구분이 실행되서 에러가 나는 경우입니다. 어디선가 같은 아이디의 테이블에 datatable 을 2번 로드하는 경우일 겁니다 참고들 하세요! 공식사이트 링크 : https://datatables.net/manual/tech-notes/3 3. Warning: Cannot reinitialise DataTable 3. Warning: Cannot reinitialise DataTable DataT..

[javascript/jquery] jquery link preview library / jquery 링크 미리보기 라이브러리 [링크] 페이지 작업을 하다보면 특정 링크 주소를 입력받아서 미리보기를 구현해야 하는 경우가 있습니다. 즉, og 태그를 활용해서 미리보기를 구현해야 하는 경우인데요, 그럴때는 jquery 플러그인을 이용해서 구현이 가능합니다. 아래 링크 들어가시면 사용법도 자세히 설명이 되어있으니 참고들 하세요! jquery 링크 미리보기 라이브러리 : https://blog.work6.kr/8 링크(href) 미리보기 기능 jquery plugin(제이쿼리 플러그인) 오늘 소개할 플러그인의 기능은 링크 미리 보기 기능 이에요. a태그의 href를 분석하여 이동할 페이지를 작게 미리 보여주는 ..