내일을 위한 오늘

웹개발을 하다 보면, 늘 새로울 때가 있습니다. 심지어 10년 넘게 해 오던 일임에도 불구하고, 공부를 게을리 하다 보면 그런 경우가 더 자주 일어나곤 합니다. javascript jquery 를 이용해 html 코드 작업을 하다 보면 data-value 를 사용해야 할 경우가 생기는데, 지금에서야 당연하게 쓰고 있지만, 몇 년 전까지만 해도 alt 속성이나 title 속성 등을 이용해서 처리하곤 했습니다. data-value 라는 게 있는지도 몰랐으니까요. 외주 일을 처리하다가 거기 직원으로부터 data-value 에 관한 정보를 들었을 때의 그 새로움이란.. 아, 부끄러움은 덤이었습니다. 이번에는 흔히 콤보박스라고도 불리는 태그를 선택했을 때, 각 옵션값에 따라 파일 업로드와 같은 특정 요소를 추가하..

웹사이트 개발시, 페이지 어딘가에 공지사항을 보여주고 싶을 때 자주 사용하는 텍스트 세로 롤링 코드입니다. 이보다도 좀 더 부드럽게 롤링되는 걸 본 적이 있는데, 차후 수정할 수 있도록 해보겠습니다. Lorem ipsum dolor sit amet.. Lorem ipsum dolor sit amet, consectetur.. Lorem ipsum dolor sit amet, consectetur adipiscing elit..

웹개발을 하다 보면 텍스트 복사하기 기능이 필요할 때가 있습니다. 그럴 때 요긴하게 쓸 수 있는 스킬을 공유합니다. 이 카피 기능을 찾게 된 계기가 있습니다. 원래는 아래와 같이 사용해서 썼는데, 문제가 발생하더군요. var copy_text = document.getElementById('copy_text'); copy_text.select(); document.execCommand('copy'); 그냥 pc 웹이나 모바일 웹에서는 잘 되는데, 하이브리드 앱에서 실행해보니, 안드로이드 기기에서는 또 안되는 겁니다. 그래서 찾아보았더니... 일단, Document.execCommand() 기능이 웹표준에서 삭제된 기능이라고 합니다... 그리고, 치명적인 단점이 있는데 복사하려는 문자는 반드시 선택(sel..

1. Printing using window.onbeforeprint and window.onafterprint. var prtContent; // The content you want to print var initBody; // Original web page body content function startPrint (div_id) { prtContent = document.getElementById(div_id); window.onbeforeprint = beforePrint; window.onafterprint = afterPrint; window.print(); } function beforePrint(){ initBody = document.body.innerHTML; document.bod..

웹페이지에 인쇄 기능을 넣고 싶은데, 인쇄 결과물에는 전체가 아니라, 특정 부분만 나오게 하고 싶을 때가 있습니다. 웹서핑을 하다보면 이런 기능이 구현된 곳이 종종 보이지요. 두 가지 방법이 있어 소개합니다. [첫 번째 방법] 같은 기능을 구현한 소스이더라도, 아이디어에 따라 다양하게 활용할 수도 있습니다. 예를 들어, 인쇄 후에는 인쇄 버튼 같은 특정 영역을 안보이게 하고 싶다거나.. 할 때, 아래 첫 번째 예시의 afterPrint() 함수 안에 원하는 코드를 작성하면 될 것입니다. var prtContent; // 프린트 하고 싶은 영역 var initBody; // body 내용 원본 // 프린트하고 싶은 영역의 id 값을 통해 출력 시작 function startPrint (div_id) { p..