일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- happycgi
- 쇼핑몰
- jquery
- 사이트제작
- #CSS
- 솔루션
- php
- #happycgi
- CSS
- #홈페이지
- 홈페이지제작
- #해피CGI
- #솔루션
- javascript
- #jQuery
- #동영상
- #이미지
- 해피CGI
- #쇼핑몰
- 게시판
- #웹솔루션
- #image
- CGIMALL
- 홈페이지
- #홈페이지제작
- #뉴스
- #업종별
- #cgimall
- 해피씨지아이
- 웹솔루션
- Today
- Total
목록웹프로그램밍 자료실/HTML 자료 (268)
웹솔루션개발 22년 노하우! 해피CGI의 모든것
아래와 같이 에니메이션 효과가 있습니다. css와 svg로 구현되어 있어 쉽게 크기 및 디자인 수정이 가능합니다. 에니메이션 효과도 css를 이용하여 변경이 가능합니다. 해당사이트 또는 첨부파일을 다운로드 받아 소스를 확인할 수 있습니다.
햄버거 메뉴 클릭시 아이콘이 병경됩니다. 햄버거 메뉴 클릭시 전체메뉴 영역이 에니메이션 효과와 함께 오픈됩니다. 자세한 소스확인은 첨부파일 다운로드 또는 해당 사이트에서 확인이 가능합니다.
세로 스크롤 형태의 테이블입니다. 상단의 타이틀이 고정된채로 내용을 보여주는 형식입니다. 데모 사이트로 이동하신 후 하단의 export버튼을 눌러 자료를 다운 받으실 수 있습니다.^^
CSS 로 이런 패턴도 생성 가능한지는 이 사이트를 방문하고 처음 알았습니다. 여러 수학적 계산식을 CSS 에서 사용할수도 있네요. 여러 샘플의 코드를 참고하여 패턴을 만들어 보는것도 좋을것 같습니다.
브라우저에서 다양한 모양의 CSS 그라디언트를 만들 수 있습니다. 원하는 모양을 만든 후 위의 Get CSS 누르면 코드를 복사 할수 있습니다.
다중으로 열기가 가능한 메뉴 메뉴별로 각각 열기가 가능합니다. 다중으로 열기가 가능합니다. 단일로 열기가 가능한 메뉴 한개의 메뉴만 열기가 가능합니다. 다른 메뉴를 열면 기존의 메뉴가 닫힙니다. 전부 닫기 위해서는 하단 버튼을 클릭해서 전부 닫을수 있습니다. 첨부파일 다운로드 및 해당 사이트에서 소스 확인이 가능합니다.
마우스 오버시 CSS로 구현된 툴팁 출력됩니다. 마우스 오버시 툴팁 에니메이션 효과 및 디자인이 css 만으로 구현되어 있습니다. 첨부파일을 다운로드 받아서 해당 소스 확인이 가능합니다.
css 만으로 구현되어 이미지 작업 없이 색상, 크기 등을 쉽게 변경이 가능합니다. 첨부 파일을 다운로드 받아 소스 확인이 가능합니다.
실제 셀렉트 박스가 아닌 라디오박스를 이용하여 css 만으로 셀렉트 형태로 구현한 셀렉트 박스 디자인 입니다. 옵션이 라디오 박스로 디자인 되어 있습니다. 마우스 방향에 따라 아이콘이 출력되는 방향이 달라서 두개씩 구현되어 있습니다. 선택된 값이 셀렉트 박스처럼 보일수 있도록 디자인 되어 있습니다.