목록2024/07 (25)

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

[해피CGI][cgimall] Tab Controls with CSS : has() 선택자를 이용한 탭메뉴

클릭시 에니메이션 효과와 함께 탭메뉴가 변경됩니다.라디오 버튼을 이용한 탭메뉴 소스입니다.라디오 버튼과 has() 선택자를 이용한 에니메이션 탭 효과입니다.첨부된 파일을 다운로드 하거나 데모 사이트에서 전체 소스를 확인 할 수 있습니다.
웹프로그램밍 자료실/HTML 자료 2024. 7. 4. 09:09
[해피CGI][cgimall] Radios With Sliding Focus 라디오 버튼 슬라이딩 포커스

선택시 라디오버튼 뿐만 아니라 포커스 되는 디자인이 시간차 에니메이션으로 효과가 적용됩니다.관련 에니메이션 소스입니다.css로 구현되어 있습니다.
웹프로그램밍 자료실/HTML 자료 2024. 7. 3. 09:03
[업그레이드] 해피 웹툰/웹소설 솔루션 ver1.4 로 업그레이드 되었습니다

안녕하세요 해피CGI 입니다. 해피 웹툰/웹소설 솔루션 Ver1.4 로 업그레이드 되었습니다.  자세한 사항은 아래의 내용을 참고하시기 바랍니다.
CGIMALL소개/업그레이드소식 2024. 7. 2. 09:22
[해피CGI][cgimall] GSAP를 이용한 무한 이미지 슬라이드

GSAP을 이용한 이미지 슬라이드입니다.스크롤하거나 버튼을 클릭하여 순서를 변경할 수 있고 무한으로 슬라이드됩니다.사이트를 구성할 때 다양한 방식으로 사용하기 좋습니다.  HTML 구조 0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 Prev Next  CSS 소스* { box-sizing: border-box;}body { background: #111; min-height: 100vh; padding: 0; margin: 0;}.gallery { position: absolute; width: 100%; height: 100vh; overflow: hidden;} .cards { position: absolute; width: 14rem; height: ..
웹프로그램밍 자료실/HTML 자료 2024. 7. 2. 09:15
[해피CGI][cgimall] SVG를 이용한 백그라운드 애니메이션 Generative Morphing Soft Gradients [Experiment, SVG]

SVG를 이용한 백그라운드 애니메이션입니다. 색상이 계속 변경되며 동적인 효과를 줄 수 있습니다. CSS 소스* {  margin: 0;  padding: 0;  box-sizing: border-box;} svg {  position: absolute;  top: 0;  left: 0;  width: 100vw;  height: 100vh;  z-index: -1;  transform: translate3d(0px, 0px, 0px);} JS 소스import tinycolor from "https://cdn.skypack.dev/tinycolor2@1.4.2";import SimplexNoise from "https://cdn.skypack.dev/simplex-noise@2.4.0"; const si..
웹프로그램밍 자료실/HTML 자료 2024. 7. 1. 09:06
Prev 1 2 3 Next