일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 웹솔루션
- 해피씨지아이
- #홈페이지제작
- #동영상
- 홈페이지제작
- 솔루션
- php
- 쇼핑몰
- jquery
- CSS
- 게시판
- #웹솔루션
- #업종별
- #이미지
- #happycgi
- #jQuery
- #해피CGI
- CGIMALL
- #홈페이지
- #cgimall
- #뉴스
- #CSS
- #솔루션
- javascript
- happycgi
- #쇼핑몰
- 홈페이지
- #image
- 사이트제작
- 해피CGI
- Today
- Total
목록웹프로그램밍 자료실/JAVA 자료 (765)
웹솔루션개발 22년 노하우! 해피CGI의 모든것
CKEditor 이 4.6 으로 메이저 업데이트가 되었습니다. 기존 기본 스킨인 Moono 에서 Moono-Lisa 로 바뀌면서 기본 디자인도 세련되게 바뀌었습니다. Copy Formatting 라는 새로운 기능도 추가 되었습니다. 업데이트 된 내용 보기: http://ckeditor.com/blog/CKEditor-4.6-released 다운로드 받기(Full package 로 다운받으세요): http://ckeditor.com/download
* Numeral.js Ver2.0.0 - 숫자 서식 지정 및 조작을위한 자바 스크립트 라이브러리 * License - MIT License numeral.min.js 파일을 스크립트 호출하면서 여러가지 형식으로 변환하여 값을 불러올 수 있도록 하고 있습니다 샘플코드와 제공되는 api 는 아래와 같습니다 # Create var myNumeral = numeral(1000); var value = numeral.value(); // 1000 # Format var string = numeral(1000).format('0,0'); // '1,000' Number Format String 10000 '0,0.0000' 10,000.0000 10000.23 '0,0' 10,000 10000.23 '+0,0' ..
* jquery TouchTouch - 최적화 된 사진 갤러리로 사이트에 일련의 사진을 쉽게 표시할 수 있는 jquery plugin * License - MIT License * 주요 기능 - css3 애니메이션 및 전환 - 화면을 가득 채우고 방향의 변화에 반응하는 반응형 css 인터페이스 - 필요할 때만 사진을 미리로드 - 스와이프 지원 - 여러 갤러리 지원 * 사용방법 - 첨부된 파일을 다운받아 압축을 해제 후 아래와 같은 코드들을 삽입하여 갤러리를 구성할 수 있습니다 자세한 내용은 첨부된 파일의 index.html 파일을 참조하시면 좀 더 이해가 빠르실 겁니다 헤더 선언부 갤러리 썸네일 선언부 스크립트 선언부
특정 위치를 지정하는 id값의 영역소스를 기준하여 해당 위치에 브라우저가 위치하게 될 경우 메뉴가 출력되게 됩니다. offset 값에 선언된 showHere 값을 가진 영역소스를 원하는 위치로 배치할때 메뉴가 출력되게됩니다.
11가지의 풀스크린 효과로 메뉴를 펼칠 수 있습니다. http://tympanus.net/codrops/2014/02/06/fullscreen-overlay-effects/?utm_content=buffer66622&utm_medium=social&utm_source=facebook.com&utm_campaign=buffer 사이트로 이동하여 데모사이트 확인, 또는 소스를 받아볼 수 있습니다. [데모페이지] - 상단의 버튼을 누른후 하단의 초록색버튼을 누르면 효과를 확인할 수 있습니다. [풀스크린 효과]
다운로드 받은 파일의 압축을 풀고 index.html 파일을 웹브라우저로 열어보면 쉽게 확인이 가능합니다. 자바스크립트로 구현된 숫자 입력툴입니다. 둥근 부분에 표시되는 영역을 마우스로 클릭해서 끌면 색깔이 칠해지는 부분이 늘었다, 줄었다 하면서 그 양을 수치로 표시해주는 기능입니다. 다양한 샘플들이 많은데, 1. 어느정도인지 수치를 표시하지 않는 형태 2. 숫자만큼 색칠하는 영역이 늘어나지는 않지만, 시계바늘과 같은 형태로 수치를 표시하는 샘플 3. 수치를 입력받아서 원형의 그래프를 생성해버리는 예제 4. 마우스 휠을 위,아래로 조절하는 이벤트를 이용해서 수치를 증가시키거나, 감소시키는 예제 위 예제 외에도 몇가지 예제들이 더 있네요. 시간을 입력받아야 하거나, 퍼센테이지를 표시하거나 하는 용도로 활용..
Swiper 는 최신버젼의 브라우저와 모바일 환경에 잘 어울리는 스와이프 코드 입니다. Swiper 의 강점은 심플함 입니다. 보통 어 이거 괜찮은데 싶은 스와이프 라이브러리를 찾았더라도 자신에게 맞게 수정하려면 다소 시간이 걸리거나 자체적인 버그가 있다던지 하는 경우가 많았습니다. 하지만 Swiper 는 정말 심플하면서도 다양한 스와이프 기능이 많습니다. 그래서 자신에게 맞는 스와이프를 조금 더 빨리 찾을 수가 있네요 ^^ ( 이게 가장 마음에 들었어요 검색시간을 줄여주네요 ㅎㅎ ) 아 그리고 자체적으로 API 를 제공 합니다. 그래서 작업이 휠 쉬워요 ^^ 다른 스와이프는 샘플 코드만 제공되거나 설명서 몇줄을 참고하는게 고작 이였지만 API가 제공된다면 보다 좋은 개발환경을 구축할 수 있어서 좋네요 ..
Javascript 를 이용한 Template 입니다. Jacascript 를 이용하여 본문내용을 변경해야 하는 경우 각 항목마다 innerHTML 해야 했는데요. 템플릿 형식으로 사용할 수 있으니 편할듯 합니다. 하지만 프로그램이 복잡해 진다면 배열이 복잡해 질듯 합니다. 지원되는 배열 또한 2차원 배열만 지원되는 듯 합니다. 그래도 잘만 사용하면 좋을듯 하네요 ^^ 라이센스는 MIT V1.1.2 를 따르고 있습니다. ^^
* ckeditor - Paste Code - 이 플러그인은 HTML 코드(스크립트나 유투브 등)를 에디터에 붙여넣기 할 수 있도록 도와줍니다. * 라이센스(무료) - GPLV3, LGPL3, MPL * 설치방법 - 플러그인 파일을 다운로드 받아 ckeditor 가 설치된 폴더내 plugins 폴더안에 업로드 합니다. 예) http://example.com/ckeditor/plugins/pastecode - ckeditor 의 설정파일인 config.js 파일을 열어 아래 소스를 추가합니다. config.extraPlugins = 'pastecode'; * 사용방법 - 에디터를 실행하여 아래와 같은 아이콘을 클릭합니다. - 호출된 창에 HTML 코드를 입력한 후 [확인] 버튼을 누르면 끝
이미지를 슬라이드 할수 있는 스크립트입니다. 다운로드 받은 파일의 압축을 풀어서 index.html 을 웹브라우져로 열어보시면 됩니다. 지원하는 기능이 몇가지가 있는데, 1. 마우스와, 터치 이벤트에 의해서 이미지가 슬라이드 되는 기능 2. 이미지와 HTML태그를 섞어도 슬라이드가 되는 기능 3. 슬라이드 자체의 크기를 비율에 맞게 조절되는 기능 4. 슬라이드의 모든 부분을 편집하거나, 비활성화 하는 기능 이미지 + HTML 컨텐츠로 슬라이드가 되는 예제 화면크기에 맞춰서 사이즈가 조절되는 예제라는데 확인이 되지는 않네요.. 스마트폰기기로 접근해보면 달라지려나 싶긴 하네요. 슬라이드가 작동이 되는 세부기능들이 조절하는 것이 가능한 예제 슬라이드가 자동으로 전환되는 주기, 1번에서 2번으로 전환되는데 까지..