일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 솔루션
- #image
- php
- #해피CGI
- 해피CGI
- CSS
- #솔루션
- #홈페이지제작
- #업종별
- #CSS
- #웹솔루션
- 해피씨지아이
- #동영상
- #쇼핑몰
- jquery
- #happycgi
- javascript
- 홈페이지
- #뉴스
- #cgimall
- 웹솔루션
- #홈페이지
- 쇼핑몰
- 게시판
- #이미지
- happycgi
- #jQuery
- CGIMALL
- 사이트제작
- 홈페이지제작
- Today
- Total
목록웹프로그램밍 자료실/JAVA 자료 (765)
웹솔루션개발 22년 노하우! 해피CGI의 모든것
Textillate.js는 멋진 라이브러리를 결합하여 모든 텍스트에 CSS3 애니메이션을 적용하기 위한 사용하기 쉬운 플러그인입니다. 애니메이션 효과는 텍스트가 들어올때, 나갈때 두가지 타임으로 구분되어 설정이 가능하며, 설정값은 약 30가지 이상입니다. 메인 슬라이드나 광고영역에 손쉽게 사용이 가능하며, 밋밋한 사이트에 생기가 생겨보이네요.
부드러운 아코디언 효과의 이미지 슬라이드 밋밋한 이미지 슬라이드 대신 가볍고 쓸만합니다, 슬라이드 이미지는 배경이미지로 호출 출력하며, 크기는 CSS, 선택시 효과 애니메이션도 제어가 가능합니다.
Diceware는 jQuery 기반의 높은 엔트로피이지만 일반 주사위를 사용하여 Diceware 단어 목록에서 단어를 무작위로 선택하는 기억하기 쉬운 암호 생성기입니다. 작동방식은 아래와 같습니다. 비밀번호 생성기는 https://world.std.com/~reinhold/diceware.html 의 제안을 기반으로 하며, 가상 주사위는 5번 역할을 하고 5자리 숫자는 단어 조회 테이블에 사용됩니다. 4개의 주사위를 굴리면 인간이 기억하기 쉽지만 해독하기 어려운 엔트로피가 높은 4개의 무작위 단어가 제공됩니다. 데모페이지에 접속을 해서, 주사위를 굴릴 회수를 선택한뒤에 Roll Dice 를 눌러보면 아래의 그림 처럼 웹페이지에 주사위를 굴리는 화면이 표시가 됩니다. 정해놓은 회수만큼 주사위를 굴리고 나면..
- 라이센스 MIT - 사용 방법 1. jQuery 라이브러리와 toaster.js 플러그인을 링크합니다. 2. 기본 토스트 메시지를 표시할 수 있습니다. 3. ERROR 메시지를 표시할 수 있습니다. 4. 시간 초과 후 토스트 메시지를 자동으로 해제할지 여부를 결정할 수 있습니다. (기본값 : true) 5. 토스트 메시지의 배경색을 지정할 수 있습니다. 6. 토스트 메시지의 위치를 설정합니다. right-top (기본값) right-bottom left-top left-bottom center 7. 토스트 메시지를 클릭했을 때 이벤트를 설정할 수 있습니다. - 작동 예제
- 라이센스 MIT - 사용 방법 1. jQuery 라이브러리와 jquery.dynamicWidth.js 플러그인을 링크합니다. 2. 크기를 조정하려는 요소에 dynamicWidth() 메서드를 호출합니다. 3. 크기 조정 가능한 요소의 최소 너비를 설정할 수 있습니다. (기본값 : 0) 4. 크기 조정 가능한 요소의 오른쪽 패딩을 추가합니다. (기본값 : 3px) - 작동 예제
다운로드 받은 파일의 압축을 해제한 뒤 index.html 파일을 웹브라우저로 열어보면 확인이 가능합니다. 웹페이지에서 스크롤을 내리다 보면 위 그림 처럼 스크롤을 따라다니는 메뉴가 상단에 붙어서 현재 보고 있는 위치가 어디인지를 표시해주게 됩니다. 사용방법은 아래와 같습니다.
다운로드 받은 파일의 압축을 해제한 후 example.html 파일을 웹브라우저로 열어보면 pie 그래프의 데모 확인이 가능합니다. 화면에 pie 그래프가 표시가 됩니다. pie 그래프에 동그라미를 클릭해서 드래그 함으로써 그래프의 비율을 조절할 수 있습니다. 그래프 하단의 비율을 표시해주고, + 버트과, - 버튼을 클릭하면, 화면에 표시되는 pie 그래프에 반영이 되게 됩니다. 사용방법은 아래와 같습니다. 그래프가 표시되는 웹페이지를 이용해서 하루 일정 등을 표시하는 용도로도 사용할 수 있겠지만, 사이트 방문자가 원하는 바를 전달을 받기 위한 용도로도 사용할 수 있겠네요.
- 라이센스 MIT - 사용 방법 1. jQuery 라이브러리와 emojiarea.js 플러그인을 링크합니다. 2. jQuery emoji-picker.js 관련 파일들을 링크합니다. 3. 입력 필드를 emoji-picker-container 컨테이너로 감싸줍니다. 4. 플러그인을 실행하여 입력 필드에 연결합니다. 5. 이미지 대신 유니코드 이모지를 삽입할 수 있습니다. - 작동 예제
- 라이센스 MIT - 사용 방법 1. jQuery 라이브러리와 draggable-msc 플러그인을 문서에 링크합니다. 2. 헤더 식별자를 사용하여 DIV 컨테이너를 만듭니다. 3. draggable-msg 플러그인을 호출하여 컨테이너를 드래그할 수 있도록 합니다. 4. 옵션으로 드래그할 수 있는 기본 식별자를 재정의할 수 있습니다. 5. 옵션으로 드래그 가능한 DIV의 초기 위치를 지정할 수 있습니다. - 작동 예제