일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 해피CGI
- 쇼핑몰
- #뉴스
- #CSS
- #홈페이지제작
- 홈페이지제작
- 웹솔루션
- #해피CGI
- 해피씨지아이
- 솔루션
- #jQuery
- #cgimall
- #업종별
- #웹솔루션
- #쇼핑몰
- jquery
- CSS
- #happycgi
- CGIMALL
- #홈페이지
- happycgi
- 게시판
- 사이트제작
- #이미지
- 홈페이지
- #솔루션
- #동영상
- #image
- javascript
- php
- Today
- Total
목록#이미지 (57)
웹솔루션개발 22년 노하우! 해피CGI의 모든것
Kakao 에서 제공하는 멀티태그 생성 OPEN API 입니다. 해당 API 데모 페이지는 아래 페이지에서 확인이 가능 합니다. http://vision-api.kakao.com/#multitag 데모 테스트시 직접 파일 첨부 또는 이미지 URL을 입력 해서 테스트가 가능 합니다. 해당 API를 이용하여 사이트내에 등록되는 게시물들에 대한 멀티태그 생성 기능을 접목하여, 해쉬태그 기능을 개발 이나 검색 기능 강화, 빅데이터 분석에 활용등으로 이용이 가능 하겠습니다. 하나의 이미지에 멀티태그가 여러가지가 생성이 되는 구조이므로, 해당 멀티태그가 저장되는 별도의 Database Table을 구축 해야 되겠습니다. 해당 API를 이용하기 위해서는 KAKAO API KEY 발행을 먼저 진행 하셔야 됩니다. ht..
Kakao 에서 제공하는 성인이미지 판별 OPEN API 입니다. 해당 API 데모 페이지는 아래 페이지에서 확인이 가능 합니다. http://vision-api.kakao.com/#adult 데모 테스트시 직접 파일 첨부 또는 이미지 URL을 입력 해서 테스트가 가능 합니다. 해당 API를 이용하여 사이트내에 등록되는 게시물들에 대한 성인 이미지 필터링 기능을 접목하여, 조금 더 원활한 사이트 관리가 가능 할것으로 보여집니다. 게시글이 작성이 될 때 첨부된 이미지들에 대한 성인이미지 판별값들을 별도로 저장 해두고, 일정 수준 이상 되는 게시글들을 관리자 페이지에서 목록으로 보여주거나, 일정 수준 이상 되는 게시글들은 글 작성 자체를 막아 버리는 방법도 있겠습니다. 해당 API를 이용하기 위해서는 KAK..
Unsplash에서 제공되는 사진들은 CC0(Creative Commons Zero) 라이센스를 채용하여 상용 용도로의 사용에 제한이 없고 수정 및 재배포도 가능합니다.(https://unsplash.com/license에서 확인가능)
* Isotope 소개 - 특정영역의 이미지를 분류하여 보여주는 편리한 jquery plugin * License - BSD, MIT License * 이용방법 - 첨부된 압축파일을 다운로드 및 압축을 해제해하여 필요한 css, js 파일을 활용하여 사이트를 구성하는데 활용할 수 있습니다 다음과 같이 문서 상단에 jquery , isotope, css 파일을 선언합니다 이번엔 영역별로 노출할 매칭될 카테고리 들을 선언해줍니다 그리고 카테고리에 소속되어 보여줘야될 이미지를 카테고리별 id값에 적용하여 내용을 각각 구성해 줍니다 그리고 하단에 isotope 가 이미지 크기에 따라 너비를 올바르게 계산할 수 있도록 jquery window load 이벤트를 연결합니다 jquery 부분에 선언되는 2개의 섹션이..
이미지에서 알고싶은 색상을 원하실땐 해당 이미지를 업로드만 하면 적용된 주요색상을 자동으로 뽑아서 출력해주는 pictones 으로 간단하게 이미지의 색상을 확인할 수 있습니다. 사이트에 접속후 본문내용을 클릭하면 이미지를 업로드할 수 있는 툴이 열립니다. 이미지를 업로드하면.. (시간이 다소 소요됩니다.^^) 위 이미지를 토대로 6개의 컬러값을 출력하였습니다. 출력된 색상을 마우스오버하면 아래와 같이 컬러값을 확인할 수 있습니다. 웹사이트 혹은 코드컬러를 알고싶을때 상당히 유용할것으로 보이네요.^^
기본 사용 기능 어떤 사이즈의 이미지이든 리스트에 출력될때 보여지는 이미지의 중심점을 손쉽게 맞출수있습니다. 상세안내 화면의 왼쪽편에 있는 설정창을 이용하여 리스트에 출력되는 이미지의 중심점을 설정할 수 있습니다. mode를 outside로 변경할경우 출력사이즈에 맞게 꽉찬 이미지를 보여주고 inside일경우 세로사진은 세로길이에 맞게 가로사진은 가로길이에 맞게 여백이 포함되며 출력됩니다. Hor. align 을 수정할 경우에는 현재 보여지는 사이즈에서 가로기준으로 이미지의 중심을 어느쪽으로 할것이냐를 선택할 수 있고, vert. align 은 세로기준으로 중심의 위치를 설정할 수 있습니다. 설정된 내용은 바로 아래 결과코드로 확인할 수 있습니다. 설정하기 전 리스트 출력 Hor. align을 cente..
jquery 를 이용해서 제작된 이미지를 확대시켜서 볼수 있는 스크립트입니다. 다운로드 받은 파일의 압축을 풀어서 index.html 를 웹브라우저로 열어서 보면 확인이 됩니다. 이미지 위에 마우스를 올리면 해당 부분에 이미지를 더 큰 이미지파일을 이용해서 돋보기처럼 확대되는 효과를 가진 자바스크립트입니다. small/ 경로에 있는 이미지는 작은이미지이며, large/ 경로에 있는 이미지는 확대된 상태에서 표시되는 이미지입니다. 소스코드는 위 그림과 같은데 data-image 는 일반 이미지 data-zoom-image 는 확대된 큰 이미지 thumb 는 하단의 작은 사진을 의미하네요. 출처는 https://www.sourcecodester.com/javascript/7802/zoom-effect-jqu..
간혹 이미지를 첨부할때 용량 제한으로 업로드를 하지 못할때가 있습니다. 그렇다고 툴을 설치하자니 어떤 툴을 찾아야 할지 막막하고 이럴때 이 사이트에서 즉시 용량을 줄일수 있습니다. 단순하게 이미지를 드래그해서 화살표 부분을 떨어트리기만 하면 용량이 줄어든 파일을 다운로드 받을수 있습니다. 개인적으로 아주 유용하게 사용하고 있는 사이트입니다.
다채로운 폴리 모양으로 구성된 20 개의 고해상도 그래픽입니다. 활기찬 기하학적 패턴으로 영역을 채우기에 적합하여 각종 배경 화면 또는 포트폴리오 작업을 제시 할 배경으로 적합합니다.