웹솔루션개발 25년 노하우! 해피CGI의 모든것

Textillate.js는 멋진 라이브러리를 결합하여 모든 텍스트에 CSS3 애니메이션을 적용하기 위한 사용하기 쉬운 플러그인입니다. 애니메이션 효과는 텍스트가 들어올때, 나갈때 두가지 타임으로 구분되어 설정이 가능하며, 설정값은 약 30가지 이상입니다. 메인 슬라이드나 광고영역에 손쉽게 사용이 가능하며, 밋밋한 사이트에 생기가 생겨보이네요.

Css3를 이용하여 다양한 효과를 확인하실 수 있습니다. 단 Css3이기 때문에 구버전 ie에는 제약이 있지만. 요근래에 구버전 ie에서도 css3 효과를 동작가능하도록 제공하는 js들이 많으니 찾아서 사용해보시는 것도 좋을것 같습니다 ^^ 하지만 trasition 그리고 animation은 있는지 확실히 장담을 할 수 없습니다 ㅜㅜ http://caniuse.com/ 위 사이트에서 브라우저별로 동작하는 css속성들을 확인하실 수 있으니 확인해보시는것도 좋을것 같습니다. 기본적으로 trasition과 animaition에대한 css3 속성을 대충 한번 훌터보시고 자료를 받아서 사용하시면 쉽게 적용가능하리라 생각합니다. http://tympanus.net/codrops/2013/05/30/simple-ic..

클릭하면 해당 메뉴의 레이어가 열리고 열려있던 레이어는 닫히는 아코디언 메뉴입니다. 레이어가 레디자인 컨텐츠를 포함이 가능합니다. 사이트에서 로그인하시면 해당 메뉴 소스를 다운로드 받으실수 있습니다. 열려있던 메뉴를 한번더 클릭하면 완전히 닫혀있는 메뉴가 됩니다. 간단한 소스로 부드럽게 작동하는 아코디언 메뉴를 만들고 응용하기 쉽습니다. 익스플로어 10버전 이상 브라우저, 크롬 브라우저에서 작동합니다.

PSD 템플릿 파일 자료와 함께 원페이지 레이아웃의 웹 템플릿 파일 정보도 확인하실 수 있습니다. 무료 홈페이지 템플릿 자료를 활용하여 홈페이지 제작에 응용해 보실 수 있겠습니다.

Css3를 이용하여 다양한 효과를 확인하실 수 있습니다. 단 Css3이기 때문에 구버전 ie에는 제약이 있지만. 요근래에 구버전 ie에서도 css3 효과를 동작가능하도록 제공하는 js들이 많으니 찾아서 사용해보시는 것도 좋을것 같습니다 ^^ 하지만 trasition 그리고 animation은 있는지 확실히 장담을 할 수 없습니다 ㅜㅜ http://caniuse.com/ 위 사이트에서 브라우저별로 동작하는 css속성들을 확인하실 수 있으니 확인해보시는것도 좋을것 같습니다. 기본적으로 trasition과 animaition에대한 css3 속성을 대충 한번 훌터보시고 자료를 받아서 사용하시면 쉽게 적용가능하리라 생각합니다. http://tympanus.net/codrops/2013/05/30/simple-ic..

플래시나 제이쿼리로 만들어진듯한 애니메이션 효과를 CSS3로 구현할 수 있습니다. 다양한 효과를 미리보기를 통해 체험하시고 직접 사용해보세요 데모 페이지에서 효과들을 체험해보신뒤 상단의 DAWNLOAD from GitHub 를 클릭하시면 소스를 확인하실 수 있습니다.

이미지료 표현해야했던 좀 더 디자인스러움이 가미된 점선라인을 CSS3에서 dashed 스타일을 보강하여 사용할 수 있습니다. 데모사이트로 이동하면, 해당 효과에 관한 HTML소스와 CSS3소스를 확인할 수 있습니다. [html] Horrible Dashes [css] .dashed-borders { background: #1d4a91; } .dashed-borders:before { content: ""; display: block; height: 5px; width: 100%; margin-top: 40px; background-color: #2356a1; border-top: 2px dashed #091f5c; border-bottom: 2px solid #091f5c; box-shadow: 0 7p..

사이트에서 단계별로 가이드 안내가 되어 있으므로, 참고하여 변경해 보실 수 있습니다. http://tutorialzine.com/2010/02/html5-css3-website-template/ [데모사이트] http://demo.tutorialzine.com/2010/02/html5-css3-website-template/template.html

HTML5와 CSS3 을 사용하여 제작되었으며, 색상 변경이 가능한 깔끔한 테마입니다. 또한, 워드프레스, 블로그 등 다르게 활용하실 수 있습니다.

CSS3를 이용하여 다양하고 고급스러운 이미지 hover효과를 보여줄 수 있습니다. 크롬브라우저를 통해 보시면 번역기능을 통해 좀 더 손쉽게 사용방법을 이해할 수 있습니다. 데모페이지에서 좌측에서는 호버의 종류 리스트를 확인할 수 있고. 클릭하시면 좌측에서 해당 호버효과와 관련된 내용이 출력됩니다. 이미지가 출력되는 부분에서는 마우스를 이용하여 미리보기가 가능하고. 바로 아래부분에서는 해당 소스를 확인할 수 있어 아주 간편합니다. 총 20여가지의 효과로 다양한곳에 적용해보시기 바랍니다.