웹을 통해 새로운 창조를 꿈꾸는 인간 - kimdirector
www.kimdirector.co.kr Photo by unsplash.com
kimdirector
Creative Web & Mobile UI/UX Planner and Designer
Humans dreaming of new creation through the UI/UX



WEBDESK
Web Standard
HOME WEBDESK Web Standard
16가지의 다양한 JQuery 소스들과 예제
Posted by kimdirector | 2014.11.13 | Hit : 6505
jQuery 반응형 웹 Parallax
목록보기이전보기
소개하고 있는 16가지의 다양한 JQuery 소스들과 예제들입니다.
JQuery에 대해서 공부하고 싶은 디자이너와 퍼블리셔들에게는 좋은 참고자료가 될 것으로 생각합니다. 반응형 웹페이지 예제, Parallax 예제, 다양한 오브젝트 활용 예제 등... 참고할 만한 예제들을 선별해서 공유합니다.

간단한 설명을 붙여 놓았으니 이해하는데 어렵지 않을 갑니다.
이미지를 클릭하면 해당 화면으로 이동합니다.

 
Intention.js
반응형 웹 디자인 적용 사례에 대한 좋은 예를 잘 보여줍니다.
브라우저에 따라 어떻게 보여주고 있는 실제로 확인하면서 어떻게 구현했는지 알 수 있습니다.


Salvattore: A jQuery Masonry alternative with CSS-driven configuration
반응형 웹디자인의 또다른 예입니다. 브라우저 사이즈에 따라 오브젝트들이 어떻게 변형되어 배치되는지 볼 수 있습니다.


Responsive Web CSS
반응형 웹페이지의 또다른 좋은 예입니다. 브라우저 사이즈에 따라서 어떻게 재배치 되는지 잘 보여주고 있습니다.


Parallax.js
아주 유명하죠. 많은 사람들이 알고 있는 소스이기도 하지요.
반응형 사이트에 Parallax를 하나의 페이지에서 구현된 흔하지 않는 예제입니다.
리소스도 다운로드 받아서 어떻게 구현되었는지 확인할 수 있습니다. 강력 추천 예제입니다.


Bootstrap Magic


Hopscotch (툴팁 활용 팁)


favico.js (구글 크롬 탭에 파비콘과 뱃지 구현 예제)


NProgress.js (프로그래스바 활용 예제)


Glide.js (배경이미지 슬라이드와 애니메이션 구현 예제)


iosOverlay.js - iOS-style overlays/notifications for the web
버튼에 따라 반응하는 예제


animo.js: A powerful little tool for managing CSS animations
애니메이션 예제


Medium.js: Taking control of content editable
메뉴바의 슬라이딩과 Onepage 스크롤 예제


FlowType.JS (슬라이드바에 반응하는 예제)


Tridiv: a web-based editor for creating 3D shapes in CSS
CSS를 활용한 3D 구현 예제


Random User Generator: Like Lorem Ipsum, but for people
랜덤으로 바뀌는 사용자의 정보를 버튼에 따라 반응하는 예제


Create CSS3: easy CSS3 generator
CSS를 생성하여 활용할 수 있는 사이트 실제로 내가 만든 CSS를 이용하여 미리보기를 할 수 있음

 
Posted by kimdirector | 2014.11.13 | Hit : 6505
Origin http://www.designyourway.net/blog/resources/new-jquery-goodies-and-online-tools-for-web-designers/
Tags jQuery 반응형 웹 Parallax
Trackback http://www.kimdirector.co.kr/bbs/zerotb.php?id=webaccessibility&no=106

COMMENT
목록보기 이전보기
WEBDESK
Design Review
Webdesign Report
Web Plan Report
Design Inspiration
Mobile Life
Web Standard
Recommend Site
Insight Story
Best View Contents
Category Cloud
About us Review Portfolio Design Review Leaders Story Mobile UXD IT Information Web Identity Everyday Story Mobile Life Webdesign
Web Standard Homepage Work Web Plan Report Practical Use Tip Inspiration Download Recommend Site
Tags
디자인 디자인 로고 브라우저 레이아웃 창의 UI 통계 코딩 IT CIP 일러스트 폰트 App 트렌드 adobo 무료 프리젠테이션 홍보 HTML5 관리 UI 웹사이트 모바일 앱 오피스 로고디자인 하이터치 시대 html 활용팁 이벤트 iPhone 플래시 이미지 편집 솔루션 다운로드 아이폰 스마트폰 태블릿 리더