비영리 민간단체의 홈페이지를 운영하다보니,후원회원 가입 페이지 개발이 필요할 때가 있습니다.

이때 이용자의 서명을 받아야 할 때가 있는데, 괜찮은 제이쿼리 플러그인이 있어서 소개할까 합니다.

 

페이지는 여기입니다 :)

http://www.jqueryscript.net/other/Smooth-Signature-Pad-Plugin-with-jQuery-Html5-Canvas.html

 

서명 그리기를 위해 html5 canvas로 직접 코딩을 하다보면,

마우스 이벤트와 터치 이벤트를 모두 고려해야 하고, 스마트폰 OS에 따라서도 고려해야 할 게 너무 많은데;;;;

플러그인을 활용하니 고민이 한번에 해결되네요 ^^/

 

여기서 입력된 값을 dataURL의 문자열로 변환시켜 서버에 전송하고, 출력할 때는 문자열 값을 다시 이미지로 변환시켜주면 되더군요.

제 경우엔 스케치북의 write_form.html과 _real.html을 손봐서 회원 서명을 받고 있답니다(는 자랑ㅋ).

(그 외에도 게시판 모듈의 쓰기 폼을 이용한 contact_us 스킨 등등을 개조해서 후원 약정을 받는 폼을 생각해볼 수 있을 거 같아요)

 

덧. 상세한 설명을 붙여봤습니다. https://xetown.com/lakepark/520085