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

screen to gif라는 무료 소프트웨어 프로그램을 이용하여 위 이미지처럼 간단하게 gif 화면 캡쳐를 할 수 있습니다. '홈페이지 바로가기' 링크를 통해 해당 사이트에 접속하셔서 소프트웨어를 다운로드 받으실 수 있습니다. 다운로드 후 해당 프로그램을 여셔서 '녹화' 버튼을 클릭하여 녹화를 진행 하신 후, 완료되시면 '정지' 버튼을 클릭하시면 됩니다. 녹화 종료시 편집기 화면이 나타나고 프레임을 삭제하거나 기타 효과를 넣는 등 다양한 편집이 가능합니다. ^^ ​ ​ ​ ​

간단한 css소스만으로 위 이미지처럼 로딩 애니메이션을 연출할 수 있습니다. ^^ ​ ​ ​

웹페이지에서 스크롤을 해도 특정 요소는 같은 위치에 머무르면서 표시하도록 하는 플러그인입니다. 다운로드 받은 파일의 압축을 해제한뒤 example/jquery.stickySmart.html 파일을 웹브라우저로 열어보면 샘플 확인이 가능합니다. 열려진 웹페이지에서 스크롤을 내려보면, 특정 컨텐츠가 스크롤이 내림으로서 웹페이지 내에서 안보여지게 되었을때 위 그림 처럼 스크롤을 따라다니면서 표시해주는 플러그인 입니다. 스크롤을 아래로 조절될 때 외에도, 스크롤을 위로 조절할 때 웹페이지의 아래쪽 부분에 표시를 해주는 것도 가능합니다. 위 그림 처럼 스크롤을 따라다니는 상태에서는 실제 웹페이지내에 표시되던 형태와는 다른 모양으로 표시하도록 커스터마이징이 가능하네요 특정 문단이 아니라, 메뉴 및 검색폼이 스크롤을..

이미지만 올리면 간단히 배경을 지워주는 사이트입니다. 이미지를 업로드시 아래 이미지와같이 배경이 사라집니다. ​ 그리고 에디트 버튼을 눌러 이미 사이트내에 배경을 합성하거나 이미지 효과를 설정하실 수 있습니다.

기본 javascript에 내장된 시간과 관련된 함수들보다 사용하기 쉬운 moment.js 입니다. https://momentjs.com/ 페이지에 접속시 샘플 소스를 확인이 가능 합니다. 해당 소스를 이용 하실려면 다운로드 받으신 moment.js 파일을 로드 해주시고 사용 하시면 됩니다. 이곳 첨부 파일을 다운로드 받으시면 테스트를 해본 소스도 같이 첨부 해두었습니다.

자동완성 스크립트인 AutoCompleteJS 입니다. 심플하고도 강력한 기능이 특징 입니다. http://autocompletejs.com/examples 페이지로 접속하면 데모 및 샘플 소스를 확인이 가능 합니다. 다양한 데모가 전시 되어 있으므로 사용하기가 편리 합니다. http://autocompletejs.com/docs 페이지에서 자세한 설정 및 옵션 확인이 가능 합니다.

스마트폰, 태블릿, 모니터 등 화면 크기나 픽셀등을 한번에 확인할 수 있는 사이트입니다. 모바일 앱 및 모바일 사이트를 제작하는 분들은 많이들 이용하시는 사이트이며, 반응형 프로젝트등에서도 미디어쿼리의 사이즈를 지정할때 유용할듯하네요. 핵심적인 디바이스별 사이즈인 width, h, device width 값으로 확인하실 수 있습니다. 그나저나 정말 다양한 기기별 해상도입니다.. 점점 맞춰 진행하는게 쉬운일이 아니게 되가네요^^

위 영역에 마우스를 오버할 경우 부드럽게 좌우로 움직이는 animation 효과입니다. 소스상에서 @keyframes slide { 0% { left: 0; top: 0; } 50% { left: 30px; top: 0px; } 100% { left: 0; top: 0; } 위 keyframes 영역은 위 녹색 구영역의 움직임을 주기 위한 영역입니다. 0% 는 첫번째 위치, 50% 는 두번째 위치할 부분, 100% 는 되돌아올 위치를 말합니다. (되돌아올 위치를 100px 로 적용하면 한번더 좌측으로 이동되므로 되돌아올 위치가 아닌 다음번 이동될 위치입니다.) slide 라는 부분은 animation-name 으로 적용할 네이밍으로 아래 추가 설명으로 안내드리겠습니다. 본 소스에서는 라는 형태의 구조이며..

사이트 주소를 입력하면 해당 사이트에 대한 다양한 CSS 통계를 확인할수 있습니다. 궁금한 사이트를 입력해보시고, 해당 사이트에 대한 다양한 통계를 확인해 보세요. ​ ​ ​

1995년 PHP 가 세상에 나타난 후 최근 8.0 베타가 시작 되는 순간까지 기록을 보실수 있습니다. ​ ​ 25년간의 PHP 의 역사를 한번 둘러보세요.