![]()
[JavaScript] html2canvas 사용 할 때, transform 때문에 이미지가 잘린 경우. 해결방법 ※ html2canvas사용방법은 이 글을 참고하세요. 아래와 같이 imageDiv(검은 영역)를 canvas에 그린 후 캡쳐할 경우 빨간색 상자가 transform이 되어 있기 때문에 아래와 같은 이미지가 아닌 오른쪽과 같이 빨간색 상자가 한쪽으로 치우친 형태로 캔버스에 그려진 후 캡쳐된다. 초록색 영역만 canvas에 그려진 것이다. 해결방법은 imageDiv에 설정되어 있는 transform을 제거 한 후 캡쳐하고 다시 transform을 설정해 주면 된다. var imageDiv = document.getElementById("imageDiv"); // 캡쳐 후 원래 위치로 복구 하기..
[JavaScript] input 에 enter key 입력 이벤트 document.querySelector('#input').addEventListener('keypress', function (e) { var key = e.which || e.keyCode; if (key === 13) { // Enter // Do something } }); [참고] stackoverflow
[JavaScript] 에서 CSV, Json 파일 읽는 방법 /* file load events */ function loadFile(sender) { // check file ext var validExts = new Array(".csv", ".json"); // Allow csv, json var fileExt = sender.value; fileExt = fileExt.substring(fileExt.lastIndexOf('.')); // If ext is not valid -> alert if (fileExt && validExts.indexOf(fileExt) < 0) { alert("Invalid file selected. valid files a..
[HTML] input file 버튼 이미지로 변경 - Label에 이미지를 넣어주고, input 을 "display: none;" 해주면 된다. + 추가 파일 업로드 후 이벤트 처리 방법 var file = document.getElementById("file-input"); file.onchange = function(){ // ... };
[Javascript] number spinner부제 : 버튼 꾹 누르면 숫자 계속 증가/감소하는 기능 구현 up down var timerInterval; var num = document.getElementById("num"); // 숫자 input box // 버튼 눌렀을 때 function mousedown(el) { timerInterval = setInterval(function () { if (el.id === "up") { // up button num.value = parseInt(num.value) + 1; } else if (el.id === "down") { // down button num.value = parseInt(num.value) - 1; } }, 100); } // 버튼..
[JavaScript] 클래스 제어 - 클래스 1개 추가 $('#element').addClass('class1'); element.classList.add('class1'); - 클래스 여러개 추가 $('#element').addClass('class1 class2'); element.classList.add('class1', 'class2'); - 클래스 1개 삭제 $('#element').removeClass('class1'); element.classList.remove('class1'); - 클래스 여러개 삭제 $('#element').removeClass('class1 class2'); element.classList.remove('class1', 'class2'); - 클래스 존재 여부 체크..
