일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
Tags
- php
- 해피CGI
- 사이트제작
- #cgimall
- #image
- happycgi
- #홈페이지제작
- #이미지
- #뉴스
- 웹솔루션
- 해피씨지아이
- javascript
- #쇼핑몰
- #동영상
- CGIMALL
- 홈페이지
- 쇼핑몰
- 솔루션
- #홈페이지
- CSS
- #jQuery
- #솔루션
- #웹솔루션
- #CSS
- 게시판
- 홈페이지제작
- #해피CGI
- jquery
- #업종별
- #happycgi
- Today
- Total
웹솔루션개발 25년 노하우! 해피CGI의 모든것
[해피CGI][cgimall] Text Highlight Animation Plugin 본문
jQuery 를 이용하여 텍스트에 애니메이션 형태의 강조 효과를 주는 플러그인 입니다.
사용방법은 매우 심플 합니다.
1. 라이브러리 호출 합니다.
<script type="text/javascript" src=https://code.jquery.com/jquery-3.4.1.min.js></script> <script type="text/javascript" src="js/jquery.marker-animation.min.js"></script>
2. 컨텐츠 구성
Hello, Dolly <span class="marker-animation">Well, hello, Dolly</span> Hello, Dolly
marker-animation class 로 강조효과를 주고 싶은 텍스트를 감싸 주세요.
3. 플러그인 실행
<script> $('.marker-animation').markerAnimation(); </script>
npm 버젼의 경우 여러가지 옵션을 제공하지만 현재 등록된 첨부파일은 npm 버젼과는 다른 버젼임을 참고 해주세요.
( Color, thickness, duration, delay, font_weight, repeat, stripe )
npm 버젼 사용하시길 희망하시는 경우 아래의 GIT 에서 확인하시기 바랍니다.
https://github.com/technote-space/jquery.marker-animation#options
MIT License 의 자료 입니다.
'웹프로그램밍 자료실 > JAVA 자료' 카테고리의 다른 글
[해피CGI][cgimall] 부드러운 고정 헤더 Jquery - sp.stickyHeader.js (0) | 2020.10.28 |
---|---|
[해피CGI][cgimall] 가벼운 Jquery 슬라이더 플러그인 - WaltzerJS (0) | 2020.10.27 |
[해피CGI][cgimall] jQuery Plugin To Duplicate & Resort Table Rows - Dynamicrows (0) | 2020.10.22 |
[해피CGI][cgimall] Jqeury 를 이용한 이미지 스토리 갤러리 (0) | 2020.10.21 |
[해피CGI][cgimall] revealjs - 웹에서 프리젠테이션 제작 (0) | 2020.10.15 |
Comments