일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- #동영상
- CGIMALL
- #웹솔루션
- 해피CGI
- #이미지
- #image
- 해피씨지아이
- 홈페이지
- php
- #홈페이지제작
- #솔루션
- 솔루션
- 웹솔루션
- jquery
- javascript
- 홈페이지제작
- #happycgi
- #홈페이지
- CSS
- #업종별
- 쇼핑몰
- #뉴스
- #cgimall
- #쇼핑몰
- 사이트제작
- 게시판
- #jQuery
- happycgi
- #CSS
- #해피CGI
- Today
- Total
목록SVG (10)
웹솔루션개발 22년 노하우! 해피CGI의 모든것
svg 파일소스 형태라 크기나 색상 변경이나 편집이 가능합니다.
세그먼트를 사용한 SVG 메뉴 아이콘 애니메이션 JavaScript 라이브러리 작동원리, 기본 구성 등 튜토리얼을 따라하면 다양한 효과를 줄 수 있습니다. 탄력적인 SBF 애니메이션을 구현하여 창의적인 효과를 볼 수 있습니다. s s s
SVG 코드를 Insert SVG란에 넣어 출력되는 Css코드를 이용하여 SVG를 백그라운드로 사용할 수 있도록 변환해주는 사이트입니다. Insert SVG에 svg 코드를 넣으면 아래와같이 출력이 됩니다. 아래의 ready for css의 코드부분에서 확인하실 수 있으며 preview에서 결과값도 확인할 수 있습니다. svg를 이용하여 보다 또렷한 아이콘을 출력하세요
SVG를 이용한 아이콘 버튼 효과 밋밋한 버튼 대신 사용하면 좋을 SVG를 이용한 귀여운 아이콘 버튼입니다.
svg 소스를 이용한 배경 소스를 쉽게 확인 할 수 있습니다. 다양한 배경소스가 있습니다. 배경스타일을 선택하면 사이트에 적용이 되어 미리 확인이 가능합니다. 사이트 우측에서 해당 배경소스의 색상,크기, 투명도를 조절할 수 있습니다. CSS 소스를 확인가능합니다. SVG 파일로도 다운도르가 가능합니다.
원하시는 SVG 아이콘을 검색하여 찾을 수 있습니다만 항목이 크게 많진 않아 한 화면에서 원하는 아이콘을 찾아 보시는게 나을 것 같습니다.^^ 아이콘을 다운로드도 할 수 있으나 SVG 특성상 copy 만 하시고 적용할 사이트내에 javascript 를 적용하여 손쉽게 아이콘 소스를 대입하는 방법으로 이용하시길 권장합니다. https://primer.style/octicons/packages/javascript 위 링크를 통해 스크립트 소스를 대입하는 방법을 확인할 수 있으며, https://github.com/primer/octicons 위 링크에서 관련 소스를 정리한 폴더를 다운받아 적용해보시기 바랍니다.
SVG로 구성한 특이한 JQuery 메뉴 SVG로 구성한 특이한 JQuery 메뉴로 색다른 구성시 좋아요 출력되는 방식, 배경색상, 내용 색상을 선택 사용 가능합니다.
Data-Driven Documents D3.js는 데이터 기반으로 문서수정을 하기 위한 Javascript 라이브러리입니다. D3.js는 HTML, SVG, CSS를 사용해서 데이터에 활기를 부어줄수있습니다. 웹 표준상에서 D3의 주안점은 개발자가 강력한 비주얼라이제이션 컴포넌트들을 결합한 자체 프로임워크로 작업하지 않아도 최신 브라우저의 호환성을 보장하는 것입니다. 그리고 DOM 수정에 대해서 데이터 관점에서 접근합니다. D3.js 파일 다운로드 파일을 다운로드 하지않아도 링크를 통해 바로 사용이 가능합니다. [script src="http://d3js.org/d3.v3.min.js"]][/script D3는 소위 '모던 브라우저'를 지원합니다. 이 말은 일반적으로 IE8 이전 버전을 제외한 브라우저..
막대형, 원형, 반원, 커스트텀 몇가지 모양을 선택할수 있습니다. 사이트에서 소스를 확인할 수 있습니다. 다운로드 버튼을 클릭해서 소스와 안내서를 다운로드 받을수 있습니다.