개인이 끄적끄적 거리는 블로그

아래 코드는 간단하게 페이지가 로드됐을때핸드폰에서 왼쪽으로 30px(?), 오른쪽으로 30px(?) 이상씩 마우스무브를 하면페이지 이동을 시키는 코드이다. 해당 페이지에 swipeleft , swiperight 이벤트를 등록시키면왼쪽으로 마우스슬라이드, 오른쪽으로 마우스슬라이드시에 이벤트가 발생한다.(휴대폰에서도) 페이지 이동방식은 두가지. 일반 웹폼 전송방식JQM 페이지 전송방식 먼저 일반 웹폽전송방식은 말그대로 기존에 웹페이지에서 폼 전송하듯 하는 방식이고.JQM 페이지 전송방식은 $.mobile.changePage("Page1.aspx", { transition: "slide", reverse: false }, true, false); 이런식으로 전송한다. 한가지 주의할점은 Page.aspx 페이지..

그라데이션 스타일을 웹에서 GUI 방식으로 그리고 확인해볼 수 있는 사이트.아는게 힘이다. http://www.colorzilla.com/gradient-editor/

요렇게 레이아웃을 간단하게 잡아주는 툴을 만들어놨음. 궂이 이걸 안써도 만들수는 있지만 그만큼의 수고를 더 덜 수 있어서 좋다. 그냥 드래그 앤 드롭만 해서 만들면 되니. http://jquerymobile.com/

HTML, CSS, jQuery로 애니메이션 그래프 만들기Posted on 2011/10/03[역자주: 원문은 Create An Animated Bar Graph With HTML, CSS And jQuery 다. 한 번 사용해 볼까 하고 번역을 했다. 내 번역은 의역이다. 따라서 빼먹는 단어, 추가하는 단어들이 있다. 그래서 정확한 번역은 아닐 수 있다. 그러나 내가 프로그래머인 만큼 코드를 보면서 나름대로 말이 되게 번역을 했다. 영 못 알아먹겠는 번역은 꺽쇠 안에 원문이나 설명을 넣었다. 당연히 오역은 있을 수 있다. 그리고 코드 검토를 충분히 해 본 것은 아니라서 코드를 엉뚱하게 설명한 게 있을지도 모른다는 불안감이 있다. 그런 게 있으면 댓글로 남겨 주시기 바란다. 약간의 오역이 있어도 영어 원..

http://caniuse.com/ HTML5 / CSS3 / SVG 등등 웹에서 사용되는 스크립트 및 기술에 대해서 현재 브라우저가 어디까지 지원하는지 자세히 설명해 주는 사이트. 지원안하는기능인데 왜 자꾸 안되나.. 삽질하지말고.. 한번씩 확인해보고 쓰는게 좋을듯.

소스는 1하고 똑같다. 단지 스타일만 변경해서 모양만 예쁘게 해줬을뿐.

모든 드래그 이벤트는 dataTransfer 객체를 통해서 이루어 진다. dropEffect : 드래그가 끝나면서 사용할 효과 지정 effectAllowed (copy,move,link) : 드래그하는 동안 어떤 효과를 사용하는지 지정. (default는 move임) clearData(type) : 주어진 유형의 데이터 삭제. getData(type) : 주어진 유형의 데이터를 가져온다. setData(type, data) 주어진 유형으로 데이터를 설정 스타일은 다음에 넣는다.. 귀찮으니까.. 기능만 우선 봅시다. 예제소스 문서1 문서2 문서3 휴지통

세션 스토리지 : 세션 동안의 데이터를 기억하고있음. 세션이 끝나면 데이터가 삭제됨 sessionStroage 객체를 사용 로컬 스토리지 : 세션이 끝나도 계속 기억하고있음. localStorage 라는 객체를 사용 저장 sessionStorage.setItem(key, value); localStorage .setItem(key, value); ex) sessionStorage.setItem('1', 데이터1); 삭제 sessionStorage.removeItem(key); localStorage. removeItem (key); sessionStorage.clear(); localStorage . clear(); 크롬에서 확인한 모습. 세션 스토리지(Session Storage) 저장! 비어있음 로컬..

간단하게 만든 그림판. 설명이 뭐가 필요하리. 주석이 최고의 설명!!! 1px 2px 5px 10px black red green blue yellow white

SVG 뿐만 아니라 VML 형식으로도 제공한다. Firefox Safari Chrome Opera IE 좋다...... http://jvectormap.owl-hollow.net/