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

마우스를 올리면 화살표가 생기는 버튼 호버 효과입니다. 다양한 사이트에서 응용 가능합니다. HTML 구조 Hover Hover CSS(SCSS) 소스* { box-sizing: border-box; margin: 0; padding: 0;} body { width: 100%; height: 100vh; display: flex; overflow: hidden;} .btn-container { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; background: var(--bg); &:nth-child(1) { --btn-bg: #d..

SWE-Bench-Pro 벤치마크를 매일 실행해서 Claude Code Opus 4.6의 성능이 실제로 저하되는지를 감지하여 그 여부를 확인할수 있는 사이트 입니다.Claude Code Opus 4.6 의 성능이 실제 저하 되었는지 여부를 체크할때 한번씩 방문해 보시기 바랍니다.

Tailwind CSS 는 CSS 프레임워크 로 쉽고 빠르게 디자인이 가능합니다.클래스 이름을 고민하거나 CSS 파일 관리할 필요 없이, HTML 에서 바로 스타일을 적용할 수 있습니다.반응형, 다크 모드도 접두어 하나로 처리되고, 빌드 시 자동 최적화까지 돼서 생산성이 크게 올라갑니다. Hello world! 간단하게 CDN 등록으로도 사용 가능합니다.빠르고 쉽게 멋있는 사이트를 제작하고 싶다면 Tailwind CSS 를 고려해 보시기 바랍니다.Tailwind CSS 로 디자인된 다양한 디자인을 아래 링크에서 확인해 보세요.https://tailwindcss.com/showcase

- 소개Fraudio는 최소한의 디자인과 깔끔한 ​​인터페이스를 갖춘 반응형 맞춤형 오디오 플레이어 플러그인으로, audio태그와 함께 작동하며 ogg, mp3, wav 등 모든 HTML5 오디오 형식을 지원합니다. - 라이센스MIT- 사용 방법1. HTML 페이지에 jQuery 라이브러리와 jQuery Fraudio 플러그인의 축소 버전을 추가합니다.2. 태그 에 CSS 클래스를 추가하고 속성에 오디오 제목과 아티스트를 정의하면 됩니다 3. 자신만의 플레이어 스타일을 만들려면, 해당 파일의 변수를 재정의하고 수정하면 파일에서 형식화된 CSS 스타일이 생성됩니다 - 작동 화면

- 소개TextTailor.js는 반응형 웹 레이아웃을 위해 설계된 jQuery 플러그인으로, 텍스트가 부모 컨테이너에 맞도록 글꼴 크기를 자동으로 조정합니다.이 플러그인은 텍스트가 부모 컨테이너의 높이(고정 또는 백분율)에 맞지 않을 경우, 넘치는 텍스트를 말줄임표(…)를 사용하여 숨기는 기능도 제공합니다. - 라이센스MIT- 사용 방법1. CDN에서 최신 버전의 jQuery 라이브러리를 로드하고 반응형 웹페이지 하단에 jQuery texttailor.js 파일을 추가하세요.2. 텍스트를 컨테이너 요소로 감싸세요. 3. CSS에서 컨테이너 요소에 높이(고정 또는 백분율)를 지정합니다. 4. 반응형 텍스트를 활성화하려면 컨테이너에서 플러그인을 호출합니다.5. 이용 가능한 옵션. minFont: 1최소..

텍스트로 나만의 명화를 만들고, 매일 열리는 예술 경연에 참여하여 전 세계 유저와 소통할 수 있는 AI 이미지 생성 커뮤니티 nightcafe AI사용방법1. 회원가입 및 계정 로그인2. 모델 선택: Stable Diffusion, DALL-E 3, Flux 등 원하는 AI 엔진을 선택합니다.3.프롬프트 입력: 만들고 싶은 이미지의 내용을 영문으로 입력합니다. (예: "Cyberpunk city in the rain")4. 스타일 지정: 사이버펑크, 유화, 애니메이션 등 준비된 스타일 필터를 클릭하여 분위기를 설정합니다.5. 생성 및 공유: 'Create' 버튼을 눌러 이미지를 생성한 후, 커뮤니티에 게시하여 다른 사용자들의 추천을 받거나 챌린지에 제출합니다. 장단점장점 1 ) 강력한 커뮤니티 장점 2..

텍스트를 가장 자연스러운 AI 목소리로 변환하여, 읽지 않고 들어서 업무와 학습 효율을 높여주는 AI 보이스 speechify AI사용방법1. 웹 및 모바일 앱에서 문서 읽기가장 기본적인 사용법으로, 준비된 텍스트나 파일을 업로드하여 듣는 방식입니다.1) 파일업로드2) 웹링크 붙여넣기3) 카메라 스캔3가지 방법으로 문서를 읽을 수 있어요.2. 크롬 확장 프로그램 웹 서핑 중 실시간으로 내용을 읽어줍니다.1) 크롬 웹스토어 확장프로그램 설치2) 웹페이지내에서 재생버튼 클릭3) 웹메일 등도 읽기가 가능합니다. 좋은 점- 배속 조절 가능- 읽어주는 단어에 시간으로 강조 됩니다.- AI 요약 : AI 가 내용을 요약 해줍니다.가격- 무료 : 3일 체험 제공 / 표준 음성 10개 제공, 1.5배속 제한- 연간 :..

# 설명 bsCalendar는 최신 Bootstrap 5 프레임워크를 사용하여 디자인된 반응형, 맞춤 설정 가능한 모든 기능을 갖춘 이벤트 캘린더를 만들 수 있는 간단하면서도 강력한 jQuery 플러그인입니다.이 프로그램은 캘린더 그리드 렌더링 , 캘린더 보기 전환, 기본 현지화 및 백엔드에서 이벤트 데이터 가져오기와 같은 기본 사항을 잘 처리합니다.탐색, 이벤트 추가(빈 영역 클릭), 기존 이벤트 상호 작용(클릭하여 업데이트 / 삭제)을 위한 컨트롤이 제공됩니다. # 라이센스 MIT 라이센스 # 주요특징 - Bootstrap 5 기반: Bootstrap의 그리드, 컴포넌트 및 스타일링을 사용하여 일관된 디자인을 제공합니다.- 다양한 보기 모드: 일별, 주별, 월별, 연도별 보기 모드를 ..

# 설명Pixlated는 Canvas API를 사용하여 이미지와 배경에 사용자 정의 가능한 필름 그레인 및 노이즈 텍스처를 적용하는 경량 웹 컴포넌트 라이브러리입니다. # 라이센스MIT 라이센스 # 특징두 가지 특수 구성 요소 : 이미지 노이즈 효과용 및 배경 노이즈 질감용.종속성 없음 : 웹 컴포넌트 API와 Canvas 2D 컨텍스트를 기반으로 완전히 구축되었습니다.고성능 렌더링 : 레티나 디스플레이에서 선명한 출력을 위해 기기 픽셀 비율에 맞춰 스케일링하는 Canvas API를 사용합니다.반응형 디자인 : 구성 요소가 컨테이너 크기에 자동으로 맞춰지고 크기 조정 이벤트에 반응합니다.프레임워크에 구애받지 않음 : 순수 JavaScript, React, Vue, Angular 또는 사용자 정의 요소..

안녕하세요 해피CGI 입니다.해피 집방 웹솔루션 Ver2.1 [입점형]으로 업그레이드 되었습니다.자세한 사항은 아래의 내용을 참고하시기 바랍니다. 해피 집방 웹솔루션 스킨B(미니홈 비내장 +내 주변검색 모바일 미포함 )해피 집방 웹솔루션 스킨B(미니홈 비내장 +내 주변검색 모바일 포함 )해피 집방 웹솔루션 스킨B(미니홈 내장 +내 주변검색 모바일 미포함 )해피 집방 웹솔루션 스킨B(미니홈 내장 +내 주변검색 모바일 포함 )해피 집방 웹솔루션 스킨A(미니홈 비내장 +내 주변검색 모바일 미포함 )해피 집방 웹솔루션 스킨A(미니홈 비내장 +내 주변검색 모바일 포함 )해피 집방 웹솔루션 스킨A(미니홈 내장 +내 주변검색 모바일 미포함 )해피 집방 웹솔루션 스킨A(미니홈 내장 +내 주변검색 모바일 포함 )