본문 바로가기

webkit

CSS3를 이용한 역동적인 웹페이지 만들기 - Transition & Transform 앞으로 CSS3가 향후 어떤 방향으로 나아갈지, 어떤 모듈을 포함할지에 대한 로드맵은 이미 정해져 있으며, 이미 많은 모듈이 최신 브라우저에 구현이 되어있다. 그 중 Webkit에서 구현이 된 Transition과 Transform이 웹페이지에서 어떻게 응용이 될 수 있는지 간단하게 볼 수 있는 웹페이지가 있어서 소개하고자 한다. Webkit엔진을 채용한 Safari나 Chrome에서 봐야한다. Demo 보기 : http://webkit.org/demos/transitions-and-transforms/ 메뉴에 마우스를 올려보면 메뉴가 부드럽게 커지는 것을 볼 수 있다. 이것은 순전히 CSS만으로 Transition의 duration속성을 이용하여 움직이는 시간을 주고 Transform의 scale 속성.. 더보기
HTML5 를 이용한 클라이언트 사이드 데이타베이스 저장소 이용하기 HTML5 표준스펙에 따르면 사용자 PC에 로컬 데이타베이스를 사용할 수 있는 기능을 사용할 수 있다고 한다. 일명 Web SQL Database라고 하는 이 기능을 이용하면 SQLlite와 같이 SQL문으로 사용자 PC에 데이타베이스를 만들어 다양한 응용을 가능하게 만들었다. 기존에는 쿠키등과 같은 단편적인 자료만 저장이 가능했다는 것을 감안한다면 매우 혁신적인 접근방법이 아닌가 생각한다. 아래 링크는 이 기능을 이용해 일종의 포스트잇과 같은 기능을 수행할 수 있도록 만들어졌다. 정상적인 동작모습을 보기 위해서는 Webkit엔진을 채용한 오페라나 Chrome에서 봐야한다. Demo보기 : http://webkit.org/demos/sticky-notes/index.html 포스트잇을 생성하고 글을 쓰고.. 더보기