본문 바로가기

퍼블리셔(프론트)/js12

jQuery focus/focusout [jQuery focus/focusout] 은근 자주사용하는 패턴인거같다.찾기 버튼에 마우스를 올리면 숨겨진 input영역이 나오고 마우스를 떼면 input 영역이 사라지는.. 하지만 이때 원하지 않는 효과가 하나 발생한다. input에 텍스트를 입력하다가 마우스 커서가 움직일때 그 영역까지 사라져버린다면? 사용자 입장에서는 당황할것... 원하는 효과는 딱 이것이다. 1. 글을 입력하는 동안(input내 커서 활성화)은 마우스를 움직여도 input이 사라지지 않도록2. input이 아닌 다른 영역을 클릭할 경우 input사라지도록 바로 focus와 focusout을 사용하는것이다. $( "input" ).focus(function() { $(this).addClass('focus'); }); $( "in.. 2018. 1. 23.
input 입력형식 지정 - mask.js [input 입력형식 지정 - mask.js] input에 특수문자 및 한글/영문 제외 ONLY 숫자만 입력하고 싶은경우가 종종? 아니 많이 있다.대표적으로 전화번호 입력폼에 가장 많이 쓰이는데 사용자가 자유롭게 입력할수있게 하는 폼이 있긴 하지만사용자와 개발자한테는 편할지 몰라도홈페이지 관리자 입장에서는 별로 반가운 방법은 아니다. 그전까지는 스크립트를 만들어서 사용했는데 mask.js가 있는걸 알게되었다. 이걸써보니 딱이야 딱. 사용방법 ↓ https://igorescobar.github.io/jQuery-Mask-Plugin/ -- 홈페이지를 들어가서 보기 귀찮으신 분들을 위해 순서 및 예제 정의 -- 1. mask.js를 inlcude한다. (include 하기 위해서는 mask.js를 다운받아야.. 2017. 5. 23.
네이버지도API 웹 적용하기 [네이버지도API 웹 적용하기] 1. 네이버 로그인 2. https://developers.naver.com/products/map/ 접속 - 오픈 API 이용 신청 3. 내용입력 (아래 사진 참고) : 본 게시글은 앱은 개발하지 않습니다 ^^;- 빨간 네모칸 4개를 본인 사이트에 맞게 변경해주세요 4. 내 애플리케이션 - 생성한 애플리케이션 - 개요 - Client ID 복사 ###### 이제부터는 소스코드에 적용해야할 부분입니다 ###### 5. include 소스파일 - 파란 부분에 복사한 클라이언트 아이디를 붙여넣습니다. 6. html 부분에 지도가 들어갈 요소를 만들어주고 css로 가로, 세로값을 지정해줍니다. (디자인 레이아웃에 맞게 css 적용) 7. 8. 좌표구하기- 검색하다가 아주 좋은 .. 2017. 4. 25.
자바스크립트 페이지 이동 [자바스크립트 페이지 이동] 어떤 도메인으로 접속했을경우 스크립트로 다른 사이트로 이동되게 할수있다. 다음과 같은 코드를 사용하면 되고, 도메인 접속했을때 가장먼저 실행되는 페이지마다 삽입해주면 된다.프로젝트 폴더구조마다 다르므로 환경에 맞추어서 삽입해주면 된다. 그런데 이상한게 하나 있다. 스크립트 코드가 끝나고 php 코드 exit가 들어간다. 왜일까? 간혹 이거를 빼먹고 그대로 스크립트만 삽입한 경우, 사용자에게 보여지는건 내가 원하는 주소지만 리소스를 보게되면 기존 홈페이지에 있던 데이터(이미지,js파일등)를 불러온다. 불필요한 리소스를 불러올 필요는 굳이 없으니 이동하면 다른걸 불러올 필요가 없다고 끝을 선언해주는 거다. 2017. 2. 2.