목록#cgimall (1322)

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

[해피CGI][cgimall]Tab Style Testimonial Slider Example

index.html 파일을 웹브라우저로 열어보면 아래와 같은 데모를 확인을 해볼수 있습니다. 흑백사진으로 사람이 표시가 되고 사진을 클릭을 해보면 사진이 컬러로 변경이 됩니다. 사진 아래의 설명문구가 해당 사진에 맞는 내용으로 조절이 됩니다. 다른 사진을 선택해보면 아래의 그림 처럼 선택한 사진과, 해당 사진에 대한 설명문구로 변경이 됩니다. 사용하는 방법은 아래와 같습니다. 탭메뉴를 이용해서, 각 탭에 해당하는 컨텐츠를 표시하는 기능의 유형입니다. 회원관리, 신청자관리, 접수자관리 등등 각각의 평가를 하거나, 각각의 평가점수를 보기 위한 화면을 구성할 때에 활용을 해볼만 한 UI인 듯 하네요. 꼭 사람이 아니더라도, 사과, 바나나, 수박 등의 과일 사진이나, 강아지, 고양이, 거북이 등의 동물 등등의 ..
카테고리 없음 2022. 2. 21. 09:45
[해피CGI][cgimall]jq-signature - 전자서명을 웹페이지에 장착

온라인상에서 (웹페이지) 전자 서명을 받을 상황이 필요하신 경우 이용이 가능한 Jq-ignature 입니다. 가볍게 구동되어 좋지만 서명하는 공간에서 마우스가 벗어났다가, 다시 서명공간으로 접근시에 마우스가 클릭이 된 형태로 서명이 이어지게 되는 불편함이 있습니다. 데모는 http://bencentra.github.io/jq-signature/ 페이지에서 확인이 가능하고, 페이지 하단에서 서명을 한뒤에 Save Signature 버튼을 클릭하여 이미지 생성을 확인 할 수 있습니다. 해당 페이지에는 이용하는 방법도 같이 기재 되어 있습니다.
웹프로그램밍 자료실/JAVA 자료 2022. 2. 15. 09:11
[해피CGI][cgimall]SK 에서 공개한 무료 폰트 suit

SK 에서 공개한 무료 폰트 입니다. 많은 프로덕트에서 사용자의 환경과 무관하게 동일한 시각적 경험을 제공하기 위해 본고딕―노토산스를 선택합니다. 라고 설명 되어있습니다. 웹폰트로도 제공하니 웹에서도 사용해보면 좋을것 같습니다.
웹프로그램밍 자료실/기타 자료 2022. 2. 14. 09:50
[해피CGI][cgimall]컬러픽커 입니다

3가지 색상을 바로보고 비교할수 있는 컬러픽커 입니다. 데모 링크를 통해서 바로 확인이 가능하며 하단의 Export 버튼을 클릭하여 자료를 다운 받으실 수 있습니다^^
웹프로그램밍 자료실/JAVA 자료 2022. 2. 10. 09:26
[해피CGI][cgimall]CSS Hover Effects 마우스 호버시 다양한 슬라이드 효과

마우스 호버시 다양한 효과를 한번에 확인 할 수 있습니다. SLIDE IN : 왼쪽에서 오른쪽으로 슬라이드 SLIDE UP : 아래쪽에 위로 슬라이드 SLIDE DOWN DELAY : 위에서 아래쪽으로 슬라이드 ( 아이콘은 출력시간 딜레이 효과 ) ROTATE : 꼭지점을 기준으로 회전하면서 출력 SCALE : 아이콘의 크기 변경 FLIP : 좌우 뒤집기 SKEW : 비스듬한 모양으로 변형 CORNER : 꼭지점에서 슬라이드 효과별 css 를 확인할 수 있습니다.
웹프로그램밍 자료실/HTML 자료 2022. 1. 27. 09:08
[해피CGI][cgimall]Jquery ui material design datepicker - codepen

Jquery ui를 이용한 달력입니다. 데모사이트로 이동을하면 오른쪽 하단에 Export 버튼을 확인하실 수 있습니다. 클릭하여 자료를 받아보시면 html,css,js 파일로 구성이되어 있습니다. Export가 되지 않는다면 회원가입 후 진행하시면 됩니다^^
웹프로그램밍 자료실/JAVA 자료 2022. 1. 13. 09:18
[해피CGI][cgimall] CSS Loader - codepen

Css3로 만들어진 로더입니다 JS는 따로 존재하지 않으며 HTML파일과 CSS만으로 만들어진 로더입니다 코드 및 데모는 데모링크를 통해서 확인하실 수 있습니다 ^^
웹프로그램밍 자료실/기타 자료 2021. 6. 15. 09:24
[해피CGI][cgimall] 해피 인터넷강의 솔루션 타입B 모바일 Ver2.0 (보안플레이어 장착옵션) 이 새롭게 오픈하였습니다

안녕하세요 해피CGI 입니다. 해피 인터넷강의 솔루션 타입B 모바일 Ver2.0 (보안플레이어 장착옵션) 이 새롭게 버전업 하였습니다. 자세한 사항은 아래의 내용을 참고하시기 바랍니다. 더 좋은 모습으로 보답하겠습니다. 감사합니다.
CGIMALL소개/업그레이드소식 2021. 5. 7. 10:48
[해피CGI][cgimall] Pure CSS Gradient Background Animation 그라데이션 배경 에니메이션

css 만으로 그라데이션 배경 에니메이션을 구현하기 body { background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab); background-size: 400% 400%; animation: gradient 15s ease infinite; } @keyframes gradient { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab); 그라데이션 색상과 ..
웹프로그램밍 자료실/기타 자료 2021. 3. 26. 09:23
[해피CGI][cgimall] JQuery Number Control with Virtual Keyboard

jquery 를 이용해서 제작된 숫자를 입력받기 위한 가상 키패드 입니다. -/+ 버튼을 이용하거나 숫자를 클릭해서 입력박스에 숫자를 채울수 있습니다. 다운로드 받은 파일의 압축을 해제하고 index.html 파일을 웹브라우저에서 열어보면 확인이 가능합니다. 입력박스를 클릭하면 위 그림 처럼 화면에 키패드가 표시되고, 키 패드에 있는 숫자를 클릭하거나, 화살표로 된 위,아래 버튼을 클릭해서 숫자를 조절해서 원하는 숫자를 입력박스에 숫자를 입력하는 툴입니다. 숫자를 하나씩 지우거나(DELETE), 초기화(CLEAR)하거나, 클릭한 숫자들을 입력박스에 넣거나(DONE) 취소(CANCEL) 하는게 가능합니다. 약간 아쉬운게 IE에서는 지원이 안되네요. bootstrap 는 사용을 해도 되고, 없어도 되긴 하지..
웹프로그램밍 자료실/JAVA 자료 2021. 3. 25. 09:22
Prev 1 2 3 4 ··· 133 Next