일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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
- 혼공단
- 혼자여행
- hover style
- 혼공파미션
- 나라여행
- 일본 사슴
- 비쥬얼스튜디오코드설치
- 혼공파
- 비쥬얼스튜디오코드
- 파이썬혼공
- 일본나라여행
- 호버스타일
- 파이썬
- input
- 일본 나라
- #파이썬
- 파이썬공부
- 파이썬혼자공부하기
- 조건문
- 파이썬문자열
- 일본
- input style
- 일본 관광
- 혼자공부하는파이썬
- Python
- 나라 사슴
- 한빛미디어
- 일본여행
- 파이썬조건문
- 혼공파선택미션
Archives
- Today
- Total
Eveningstar
[clipboard.js]해시태그 복사하기 본문
clipboard.js — Copy to clipboard without Flash
인스타 이벤트나 페이스북, 트위터 이벤트를 시행할때 사용자가 쉽게 참여할수있도록 유도하기 위해 버튼을 누르면 해시태그가 복사되게 하는 js
깃허브 - https://github.com/zenorocha/clipboard.js/
사이트 - https://clipboardjs.com/
cdn - https://github.com/zenorocha/clipboard.js/wiki/CDN-Providers
1) 스크립트에 js 추가하기
1 | <script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script> | cs |
2) html 부분에 copy될 부분과 이벤트를 실행할 버튼 부분을 추가해준다.
1 2 3 4 | <p class="copy">#해시태그</p> <a href="#none" class="hashtag_copy" data-clipboard-action="copy" data-clipboard-target="p.copy" ></a> | cs |
3) 스크립트에 이벤트 액션 추가해주기
1 | var clipboard = new ClipboardJS('.hashtag_copy'); | cs |
+ 해시태그 복사 후 알럿창을 띄우거나 이벤트를 추가하고싶다면
1 2 3 4 5 | clipboard.on('success', function(e) { alert('복사되었습니다.'); }); | cs |
적용 -> https://jsfiddle.net/jywoo/frpa702m/5/
'Storage' 카테고리의 다른 글
[유투브] 유튜브 동영상 반응형으로 넣기 (0) | 2018.09.27 |
---|---|
[공유] 페북,카카오톡,블로그,카페 등 (0) | 2018.09.27 |
웹사이트 성능 및 속도 분석 (0) | 2018.07.04 |
[수직 아코디언]horizontal accordion (0) | 2018.06.17 |
[공유] meta 캐시 지우기, 공유 캐시 지우기 (0) | 2018.06.03 |
Comments