- Today
- Total
목록jquery (6)
CODE CAVE
콤마 삭제 함수 rm_comma(number)//콤마 삭제 function rm_comma(num){ var number = num + ""; return number.replace(",",""); } 먼저 파라미터 이름이 num 이라서 숫자만 받아올 것 처럼 짜놓긴 했는데요~ 문자열을 넘기든 숫자를 넘기든 어차피 num + "" 을 해서 문자열로 만들기 때문에 상관은 없습니다. 파라미터를 문자열로 만들고 거기서 "," 를 ""(공백)으로 replace 해서 return 하는 것 입니다. -- 웹 사이트를 만들다보면 콤마를 삭제하는 경우가 종종 있는데요~ 이건 제 얘기입니다만.. 어디 회사에 새로 들어가게 되었는데 디비 설계가 잘못 되어있었습니다. Database 의 상품 테이블의 1 상품이 1 필드에 ..
로그인 할때 아이디 저장 기능은 많이들 쓰죠!아이디 저장 기능을 제공하지 않는 사이트를 찾는게 더 힘든 요즘 입니다. 이번에 제가 값 저장 기능. 다시 한번 개발하면서 사용한 소스를 공유 하려고 합니다~ 값의 저장에는 여러가지 방법이 있죠.PHP의 세션으로 웹서버에 어떤 값을 키와 함께 저장할 수 있지만클라이언트 단에서 쿠키의 사용도 가능합니다! 자바스크립트가 있기에 가능한 일이죠. 이번에 포스팅 할 것은 이 쿠키를 사용하여 어떤 값을 키:값 형태로 브라우저에 저장해서 사용 해보는 것을 보여 드리려고 합니다. 일단 쿠키의 생성(setCookie), 삭제(deleteCookie), 얻기(getCookie)는 인터넷에 여기저기 퍼져있는 자바스크립트 소스 그대로 가져왔습니다! 뛰어나신 프로그래머들이 매우 많기..
placeholder가 되게 간편한 기능 중 하나죠! 필수적인 기능이기도 하구요 ㅋㅋ 2009년도였나~ 그 때쯤 저는 placeholder 를 하기 위해서 홀더로 쓸 이미지를 자르고 input 에 onfocus등을 이용해서 개발했던 때가 떠오르네요.. 정말 귀찮고 힘들고 개발이 하기 싫은정도까지 만드는 작업이였습니다. 이럴 시간에 로직에 좀 더 고민을 하고 싶었는데 말이죠.. 그래서 placeholder라는 속성이 나와서 편해지긴 했습니다. 하지만 편리해지면 편리해지는 만큼 동시에 호환성은 항상 문제로 뒤따라오죠! placeholder를 IE8,9에서도 호환시키는 방법은 여럿 있겠지만 아마 제일 중요한 부분은 플랫폼에 독립적이고 (부트스트랩과의 충돌문제 제거) 사용하기가 쉬워야 하는 것이지 않을까요. 이..
jQuery로 화면 사이즈를 구해야 할 일은 많습니다. 특히 모바일은 디바이스가 워낙 다양해서 한 페이지가 디스플레이 크기에 따라서 변화하는 식으로 반응형 디자인을 하고, 그 것이 실제로 디바이스 크기에 반응하도록 하는 CSS 기능 중에 미디어 쿼리라는 기능이 있습니다. 자바스크립트로도 미디어 쿼리 처럼 화면 사이즈 별로 실행해야할 행위가 다를 경우에 할 수 있는 방법이 있습니다. 물론 jQuery로 하면 더 간단한 문법으로 적용할 수 있겠죠. 그래서 이번 포스팅에서는 jQuery로 화면 사이즈를 구하고 화면 사이즈에 따른 코드를 분기 해보겠습니다. function open_chatroom(){ var windowWidth = $( window ).width(); if(windowWidth < 500) ..
웹 사이트에 쿠키를 이용하면 여러가지 것들을 만들 수 있습니다~ 어떤 배너를 오늘 하루 보지 않기, 로그인 접속자만 보이기, 브라우저로 새 접속시에만 보기 등등.. 무언가 고유한 값을 저장해놓고 사용할 수 있게 됩니다. 변수는 프로그램이 실행될때 초기화가 되고 값이 부여되고, 프로그램을 닫으면 모두 소멸됩니다. 데이터베이스는 데이터를 지우지 않는 이상 계속 남아있게 되지만 전용 서버가 있어야 합니다. 하지만 쿠키는 일정 기간 동안 지워지지 않고 클라이언트 PC에 저장되게 됩니다. 즉, 유저 마다 고유한 어떤 값을 프로그램 종료시에도 보관하고 있게 되는 겁니다. 이런 쿠키는 여러 사이트에서 볼 수 있습니다. 이번에 제가 포스팅 해볼 것은 쿠키에 대한 것으로 브라우저로 새 접속시의 쿠키 사용 입니다. 예제는..
이번에 소개 해드릴 것은 swiper 라는 라이브러리 인데요~ 간단하게 이미지 슬라이더를 구현 할 수 있는데 여기에 터치 스와이프 까지 지원해서 모바일에서 쓰기에도 매우 적합하다고 보여집니다~ 저도 실제로 한개의 데스크탑 슬라이드와 한개의 모바일 웹 사이트에 적용해봤는데 매우 자연스럽고 확장성도 좋았습니다. 공식 사이트는 여기 이구요. 스와이프 라이브러리 사용법은 아래와 같습니다. new Swiper('.container', { pagination: '.swiper-pagination', paginationClickable: true, spaceBetween:0, loop: true, }); 위 처럼 작성 해주시면 자바스크립트 쪽은 끝 입니다. 매우 직관적이죠? 객체를 생성하면서 생성자에 인수를 넘기는 ..