프로그래밍4 js - click & dbclick 동시 사용 방법 js - click & dbclick 동시 사용 방법 이벤트를 적용하다보면 같은 대상에 클릭과 더블클릭 이벤트를 적용해야되는 일이 생긴다. 이때 $('#id').click 과 $('#id').dbclick 과 같이 이벤트를 따로 선언해서 사용하면 더블클릭 이벤트가 처리가 안된다. 해결방법은 on() 함수와 타이머관련 함수들을 이용하여 해결이 가능하다. Code 코드는 다음과 같다. 설명 먼저 클릭할 대상을 만든다. 제이쿼리를 이용하여 클릭 이벤트와 더블클릭 이벤트를 선언해준다. 클릭 이벤트 발생시 클릭카운트를 증가시켜 클릭 한번시 if문이 실행되며 setTimeout 함수를 통해서 Click 함수가 실행 후 다시 카운트를 0 으로 만든다. 더블클릭 이벤트 발생시 기존 더블클릭 이벤트는 preventDef.. 2021. 8. 26. Include HTML을 이용한 html 파일 분리하기 들어가며 웹페이지 구조를 잡다보면 중복적으로 들어가게 되는 코드들이 존재하게 된다. 예를들어 상단에 헤더나 하단의 푸터같은 경우를 예로 들 수 있다. 기존 스프링에서 했을때는 thymleaf를 이용하여 이 작업을 하였는데 이번에 javascript만으로도 분리를 하는 방법을 알게 되어 정리한다. includeHTML.js 해당 스크립트문을 통해서 include-html이 포함된 html 파일을 로드할 수 있다. function includeHTML(callback) { var z, i, elmnt, file, xhr; /*loop through a collection of all HTML elements:*/ z = document.getElementsByTagName("*"); for (i = 0; i.. 2021. 7. 21. CSS - position : absolute 를 이용한 div 위치 지정 CSS - position : absolute 를 이용한 div 위치 지정 position은 태그들의 위치를 결정하는 css이다. 기본적으로 div 정렬 시키는 방법은 다양하지만 position을 이용하게 되면 내가 원하는 위치에 어디든 정확히 위치 시킬 수 있다. 글로만 설명하면 이해가 쉽지 않아 아래 그림을 통해 알아본다. 기본적으로 모든 태그들의 디폴트값은 static 상태이며 차례대로 왼쪽에서 오른쪽, 위에서 아래로 쌓인다. position : absolute position: absolute; 포지션 값을 absolute로 주게 되면 position 값이 static 속성이 아닌 relative, absolute, fixed인 부모 태그를 기준으로 기준점을 삼는다. 만약 relative, abs.. 2021. 7. 12. Nginx - Nginx와 Node.js 환경 서버 구성하기 (feat. Windows) 들어가며 Nginx 이해와 활용 방법에 이어 환경 구성하는 방법을 정리한다. 먼저 운영체제는 Windows 환경에서 진행하였고 우분투와 같이 다른 운영체제에서 사용하시는 분들은 설치 방법등만 차이가 있으니 큰틀의 흐름에 따라 진행하면 된다. node.js 환경 갖추기 제일 먼저 node.js에 환경 먼저 구성한다. 아래에 링크 참고를 하여 진행해준다. https://sjparkk-dev1og.tistory.com/38?category=1025699 Node.js - Node.js & NPM Node.js - Node.js & NPM 정의 (Node.js 공식 사이트) Node.js®는 Chrome V8 JavaScript 엔진으로 빌드된 JavaScript 런타임입니다. Node.js는 이벤트 기반, N.. 2021. 6. 25. 이전 1 다음
