웹솔루션개발 22년 노하우! 해피CGI의 모든것

[해피CGI][cgimall] 웹표준 클립보드 복사 - ZeroClipboard 본문

웹프로그램밍 자료실/JAVA 자료

[해피CGI][cgimall] 웹표준 클립보드 복사 - ZeroClipboard

해피CGI윤실장 2017. 2. 7. 10:14

설명

과거 클립보드 복사 버튼을 제작할 때 자바스크립트의 내장 함수를 사용하였으나,
브라우저가 다양해지고 버전이 높아짐에 따라 위 소스를 사용할 수 없게 되었습니다.
ZeroClipboard 는 플래시(SWF)파일을 이용하여 간단하게 웹표준 클립보드 복사 버튼을 제작할 수 있습니다.



첨부파일 목록

index.html
jquery.min.js
ZeroClipboard.min.js
ZeroClipboard.swf



사용방법 (index.html 파일의 소스를 통해 확인가능)


  1. HTML 파일 상단에 jquery.min.js 파일과 ZeroClipboard.min.js 파일을 링크해줍니다.
     
  2. input 태그나 button 태그를 이용하여 버튼을 삽입한 뒤
    data-clipboard-text 속성을 이용하여 복사할 TEXT를 입력합니다.



     
  3. 아래 소스를 삽입하여 ZeroClipboard.swf 파일의 경로와 버튼의 ID 등을 수정해 줍니다.



     
  4. 파일 저장 후 브라우저를 통해 기능을 테스트합니다.

 

홈페이지바로가기 

Comments