| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | ||||||
| 2 | 3 | 4 | 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 | 13 | 14 | 15 |
| 16 | 17 | 18 | 19 | 20 | 21 | 22 |
| 23 | 24 | 25 | 26 | 27 | 28 | 29 |
| 30 | 31 |
- 이미지
- #cgimall
- 사이트제작
- 홈페이지
- #업종별
- jquery
- javascript
- #이미지
- php
- #image
- 해피CGI
- CSS
- #CSS
- 웹솔루션
- #jQuery
- #해피CGI
- #홈페이지
- 게시판
- #쇼핑몰
- 홈페이지제작
- #홈페이지제작
- #동영상
- #솔루션
- #뉴스
- #웹솔루션
- #happycgi
- CGIMALL
- 솔루션
- happycgi
- 해피씨지아이
- Today
- Total
목록happycgi (2619)
웹솔루션개발 26년 노하우! 해피CGI의 모든것
[해피CGI][cgimall] ElevenLabs - 자연스러운 AI 음성, 이미지, 영상 생성 서비스
# 특징 ElevenLabs는 텍스트를 입력하면 AI가 자연스러운 음성으로 읽어 주는 음성 생성 플랫폼입니다.단순한 기계음이 아니라 억양, 감정, 속도, 말투가 비교적 자연스럽게 표현되는 것이 특징입니다. 주요 기능으로는 텍스트 음성 변환, 음성 복제, 음성 변조, 보이스 디자인, 더빙, 효과음 생성, 음악 생성, 이미지·영상 생성 기능 등이 있습니다. 특히 70개 이상의 언어를 지원하며, 한국어를 포함한 다양한 언어의 음성 콘텐츠 제작에 활용할 수 있습니다. 또한 웹에서 바로 사용할 수 있는 ElevenCreative, 대화형 음성 에이전트를 만들 수 있는 ElevenAgents, 개발자가 서비스에 음성 기능을 연동할 수 있는 ElevenAPI를 제공합니다. # 장점 ElevenLabs의 가장 큰 장점..
[해피CGI][cgimall] Responsive Flip Pricing Table 반응형 플립 가격표
3D 카드 뒤집기(Flip Card) 효과를 이용한 가격표 UI입니다.사용자가 카드를 클릭하거나 호버하면 앞면에서 뒷면으로 180° 회전하며 추가 정보를 보여주는 방식입니다.상단 월간 년간 라디오 버튼을 클릭하면 플립 애니메이션 효과와 함께 가격표가 전환됩니다.애니메이션 css 소스입니다.(일부)애니메이션 js 소스입니다.(일부)첨부파일을 다운로드 받으시거나 해당 사이트에서 html,css,js 전체 소스를 확인할수 있습니다.
[해피CGI][cgimall] Gradient Button Animations 그라디언트 버튼 애니메이션
마우스호버시 그라디언트 애니메이션 효과가 있는 버튼입니다.버튼 그라디언트 소스입니다.버튼 애니메이션 소스입니다.첩부파일 또는 해당 사이트에서 전체 소스를 확인할 수 있습니다.
[해피CGI][cgimall] 그리드 재배치 애니메이션CSS
그리드 카드의 위치가 바뀔 때 CSS만으로 부드러운 이동 효과를 구현한 예제입니다.JavaScript 없이 레이아웃 변화에 따른 애니메이션을 적용할 수 있습니다.카드 목록, 갤러리, 대시보드 UI의 전환 효과를 만들 때 참고하기 좋습니다.HTML 구조 CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTENT CONTEN..
[업그레이드] 해피 LMS 환급형 웹솔루션 Ver1.1로 업그레이드 되었습니다
안녕하세요 해피CGI 입니다.해피 LMS 환급형 웹솔루션 Ver1.1로 업그레이드 되었습니다.자세한 사항은 아래의 내용을 참고하시기 바랍니다.
[해피CGI][cgimall] GSAP 탭 콘텐츠 애니메이션(Tab content toggle)
탭을 클릭하면 선택한 콘텐츠가 부드럽게 전환되는 UI 예제입니다.SplitText를 사용해 텍스트를 줄 단위로 나누고, GSAP 애니메이션으로 자연스럽게 등장시킵니다.단순한 탭 메뉴보다 시각적인 효과가 좋아 랜딩페이지나 소개 섹션에 활용하기 좋습니다.텍스트 중심의 콘텐츠 전환 효과를 구현할 때 참고하기 좋은 자료입니다.HTML 구조 CSS 소스* { box-sizing: border-box;} body { margin: 0; min-height: 100vh; display: grid; place-items: center; background: #f4f4f0; font-family: Inter, sans-serif; font-size: 16px;} .tabs-demo { width: ..
[해피CGI][cgimall] 마우스 오버하면 서치 영역이 나타나는 애니메이션 버튼 Animated Search Box
마우스 오버하면 서치 영역이 나타나는 애니메이션 버튼입니다.동적인 효과를 줄 수 있어서 유용한 효과입니다. HTML 구조 CSS 소스body { background: #212129;} ::selection { background: #212129;} .search-wrapper { position: absolute; transform: translate(-50%, -50%); top:50%; left:50%;}.search-wrapper.active {} .search-wrapper .input-holder { height: 70px; width:70px; overflow: hidden; backg..
[해피CGI][cgimall] 클릭하면 다운로는 되는 애니메이션 Download Animation (SVG)
클릭하면 다운로는 되는 애니메이션을 재밌게 표현한 소스입니다. 다양한 상황에 응용 가능합니다. HTML 구조 0 % Reset a href="https://dribbble.com/shots/2939772--Daily-UI-Download" target="_blank" class="icon-link"> img src="http://icons.iconarchive.com/icons/uiconstock/socialmedia/256/Dribbble-i..
[해피CGI][cgimall] Pentest-Tools Port Scanner with Nmap - 온라인 포트 스캐너 및 네트워크 점검 도구
Pentest-Tools Port Scanner with Nmap은 별도의 프로그램 설치 없이 웹브라우저에서 사용할 수 있는 온라인 포트 스캐너입니다. Nmap 기반으로 동작하며, 서버나 네트워크 장비에서 외부에 노출된 포트와 실행 중인 서비스를 확인하는 데 활용할 수 있습니다. 일반적으로 서버를 운영하다 보면 SSH, FTP, HTTP, HTTPS, DB, 메일, 원격접속 포트 등이 외부에 열려 있는지 점검해야 할 때가 있습니다.이 도구를 사용하면 특정 도메인, IP 주소, 네트워크 대역을 대상으로 포트 상태를 확인하고, 방화벽 설정이나 불필요한 서비스 노출 여부를 점검할 수 있습니다. 주요 기능은 다음과 같습니다. * TCP 포트 스캔* UDP 포트 스캔* 주요 포트 빠른 스캔* 전체 포트 범위 ..
[해피CGI][cgimall] Dotcom-Tools - 웹사이트 속도, 성능, 접속 상태를 확인할 수 있는 온라인 진단 도구
Dotcom-Tools는 웹사이트 운영자, 개발자, 서버 관리자 등이 사이트의 접속 상태와 성능을 확인할 때 사용할 수 있는 온라인 기반 진단 도구입니다. 별도의 프로그램 설치 없이 웹브라우저에서 바로 사용할 수 있으며, 웹사이트 속도 테스트, Ping 테스트, DNS 조회, Traceroute, SSL 인증서 확인, 포트 체크, HTTP 헤더 확인 등 다양한 네트워크 및 웹 성능 관련 기능을 제공합니다. 특히 웹사이트 속도 테스트 기능은 여러 지역에서 사이트 접속 속도를 확인할 수 있어,실제 사용자 환경에 가까운 성능 점검이 가능합니다.페이지 로딩 시간, 응답 속도, 리소스별 로딩 상태 등을 확인할 수 있기 때문에 사이트가 느리게 열리는 원인을 파악하는 데 도움이 됩니다.로그인 없이 무료로 3개 지..