기본적으로 자바스크립트를 통해 load 이벤트를 처리하는 방법중 가장 보편적으로 사용되는 방식은 아래와 같이 두가지가 있다.
<script>
// 방법1
window.addEventListener('load', function() {
});
// 방법2
window.addEventListener('DOMContentLoaded', function() {
});
</script>
기본적으로 자바스크립트를 통해 load 이벤트를 처리하는 방법중 가장 보편적으로 사용되는 방식은 아래와 같이 두가지가 있다.
<script>
// 방법1
window.addEventListener('load', function() {
});
// 방법2
window.addEventListener('DOMContentLoaded', function() {
});
</script>
특정 레이아웃 안에서 스크롤이 생길 시 마우스 스크롤을 일일이 클릭 후 이동하여 화면을 봐야하는 불편함이 있는데 마우스 이벤트를 이용하여 클릭 후 스크롤을 자동으로 이동 시킬 수 있는 방법이 있다. 검색을 해보면 마우스 스크롤 이벤트는 상당히 많이 존재하는데 이를 이용하여 직접 만들 수 도 있지만 우리는 항상 시간이 부족하기때문에 시간이 조금 난김에 아래와···
생년월일은 과거 달력에서 선택하는 방식을 많이 채택하였지만 나이가 있으신분들은 한참을 뒤로 가야하는 불편함이 발생되어 요즘은 입력방식을 사용하는편이다. 이번편에서는 간단하게나마 생년월일 입력 후 슬래시(/) 또는 하이픈(-)을 붙여주는 스크립트이다. 본래 이번편에 소개하는 예제는 JS 라이브러리로 제공할 목적이였으나 시간상 여유가 없어 간단하게 입력 후 처···
PRISMJS 라이브러리란 코드의 가독성을 높여주는 일종의 CSS 스타일 자동화 라이브러리로 이해하면 된다. 이 라이브러리는 이식성도 좋기때문에 tinymce(최신버전 기준) 에디터에서도 사용이 가능하다. 다만 tinymce 같은경우 설정이 필요하기때문에 이부분은 이번편에서는 패스하도록 하자 PRISMJS 사이트는 아래와 같다. (메타데이터가 없어서 링크 ···
ajax는 비동기 통신을 위한 방법인데 간혹 연속 클릭으로 인해 중복 처리가 되는 경우가 있다. 물론 프로그램단에서 db 조건과 비교하여 막는 방법이 있지만 request 한 페이지에 외부 api 통신이 있을 경우 딜레이가 발생되어 중복체크를 하가기 어렵다. 따라서 이번편에서는 클라이언트단에서 연속 click 이벤트를 막는 방법에 대해 예제소스를 통해 알아···
여러 사이트를 개발하다보면 롤링 스크립트를 넣어야 하는 경우가 있다. 물론 나는 사이트를 무겁게 만드는 롤링 스크립트들을 좋아하지는 않는다. 하지만 사용자의 보는 눈을 한층 더 즐겁게 만들어 주는 롤링 스크립트는 많은 요청이 있기때문에 여러 롤링 스크립트를 알아 두면 좋다. 오늘 소개할 롤링 스크립트는 Siema 로 상당히 가벼운 롤링 스크립트인것 같아 리···