일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 해피씨지아이
- #jQuery
- #cgimall
- #이미지
- 사이트제작
- #업종별
- #쇼핑몰
- 쇼핑몰
- javascript
- #동영상
- 웹솔루션
- #happycgi
- #홈페이지제작
- #뉴스
- 솔루션
- CGIMALL
- 게시판
- CSS
- 홈페이지
- php
- #솔루션
- 홈페이지제작
- #CSS
- #해피CGI
- #웹솔루션
- #image
- happycgi
- jquery
- #홈페이지
- 해피CGI
- Today
- Total
목록2021/07 (19)
웹솔루션개발 22년 노하우! 해피CGI의 모든것
SVG를 이용한 아이콘 버튼 효과 밋밋한 버튼 대신 사용하면 좋을 SVG를 이용한 귀여운 아이콘 버튼입니다.
마우스 오버시 이미지를 변경하는 Javascript 이미지 영역에 마우스 오버시 이미지가 변경되는 Javascript 소스 첨부된 Javascript 소스내 이미지경로를 지정할 수 있으며, 변경시 합성되는 이미지 경도 지정할 수 있습니다.
다운로드 받은 파일의 압축을 해제한 후, 웹서버에 업로드한뒤에 웹브라우저로 해당 페이지에 접속해보면 아래 그림과 같은 화면이 열리는게 확인이 됩니다. examples/simple.html 이란 링크를 클릭해보면 지도를 이용해서 위치정보를 알아낸 뒤에 위치정보를 활용하는 몇가지 예시를 확인해볼수 있습니다. 입력박스를 클릭해보면 지도가 표시되고, 마우스를 이용해서 지도를 움직인 후에, 원하는 위치를 클릭을 해보면 클릭된 위치의 위치정보(위도,경도) 를 입력박스에 입력을 해주거나, 웹페이지에 표시하는 몇가지 예제들을 확인해볼수 있습니다. 예제와, 해당 예제를 이용하기 위해서 작성된 소스코드의 확인이 가능합니다. 웹사이트에서 접속자들로부터 필요한 위치(위도,경도)에 대한 정보를 입력받거나, 정보를 제공하기 위해..
css와 자바스크립트를 이용해 제작된 뉴모피즘 스타일 버튼과 텍스트박스 입니다. 사용하고싶은 버튼의 css와 js 소스를 찾아서 적용할 수 있습니다.
css와 자바스크립트를 이용하여 제작된 이미지가 부드럽게 넘어가는 반응형 갤러리입니다. 마우스 휠을 이용해서도 이미지를 넘길 수 있습니다.
무료 SVG 아이콘 이미지를 받을 수 있습니다. 다양한 아이콘을 크기 색상 조절도 가능하며, 클릭만 하면 클립보드에 복사 됩니다 위와 같이 복사된 아이콘 태그를 사용하면 되겠습니다.
위의 이미지를 보시면 기능 확인이 바로 되실 겁니다. 소스 적용도 간단합니다. var popbox = new Popbox({ blur:true, overlay:true, }); 위의 스크립트와 Popbox content 1 Close Popbox content 2 Close Main content of the page Open mypopbox 1 Open mypopbox 2   위의 기본 HTML 을 참고하시면 되겠습니다.
색상에 관련된 모든것을 찾아보고 확인할 수 있는 사이트입니다 https://colorbank.net 메인화면에 색상코드를 넣고 동시비교 https://colorbank.net/index2.html 그이외에도 색상코드, 색상명칭, 매트리얼픽커, 그라데이션 팔레트등 다양한 색상조합 및 색상관련 페이지를 확인하실 수 있습니다. 디자인시 유용하게 사용할 수 있을듯 합니다
해피CGI, #happycgi, #cgimall, #JQuery, #image, #zoom, #이미지확대 - 라이센스 MIT - 사용 방법 1. 파일 상단에 Jquery 라이브러리와 xzoom.css 파일, xzoom.min.js 파일을 링크합니다. 2. IMG 태그로 이미지를 출력하고 아래 옵션을 적용합니다. · xoriginal - 확대/축소된 이미지로 사용되는 큰 이미지 경로 · xpreview - 선택 사항이지만 설정 시 이 속성은 중간 미리보기 이미지로 사용되는 반면 이 경우 src 속성은 작은 축소판 이미지로 사용됩니다. 이 속성이 설정되어 있지 않으면 src 속성이 중간 미리보기 이미지로 사용됩니다. · xtitle - 캡션으로 사용될 텍스트 문자열이며 titleClass가 있는 "div" ..
- 라이센스 MIT - 사용 방법 1. 파일 상단에 Jquery 라이브러리와 jquery.fixedTableHeader.js 파일을 링크합니다. 2. Table 소스코드를 코딩하고, fixedTableHeader 플러그인을 호출합니다. 3. 고정될 헤더 부분을 지정합니다. (기본값 : th) 4. 고정되었을 때 헤더 부분의 CSS를 재정의할 수 있습니다. - 작동 예제