[JavaScript] 키보드 이벤트 ( 단축키/hotkey ) 생성하는 방법 ex) `Ctrl + Alt + c` 을 눌렀을 때 이벤트 생성 var isCtrl, isAlt; // ctrl. Alt 눌림 여부 확인 document.onkeyup = function(e) { if (e.which == 17) isCtrl = false; if (e.which == 18) isAlt = false; } document.onkeydown = function(e) { if (e.which == 17) isCtrl = true; if (e.which == 18) isAlt = true; console.log(e.which , isCtrl, isAlt) if (e.which == 67 && isCtrl == tru..
WEB/JavaScript
[JavaScript] html2canvas 사용 할 때, transform 때문에 이미지가 잘린 경우. 해결방법 ※ html2canvas사용방법은 이 글을 참고하세요. 아래와 같이 imageDiv(검은 영역)를 canvas에 그린 후 캡쳐할 경우 빨간색 상자가 transform이 되어 있기 때문에 아래와 같은 이미지가 아닌 오른쪽과 같이 빨간색 상자가 한쪽으로 치우친 형태로 캔버스에 그려진 후 캡쳐된다. 초록색 영역만 canvas에 그려진 것이다. 해결방법은 imageDiv에 설정되어 있는 transform을 제거 한 후 캡쳐하고 다시 transform을 설정해 주면 된다. var imageDiv = document.getElementById("imageDiv"); // 캡쳐 후 원래 위치로 복구 하기..
[JavaScript] html2canvas html2canvas [링크] 웹(html)에서 화면을 캡쳐하는 기능. 실질적으로는 선택한 요소를 Canvas에 그린다. 하위 자식들까지 모두 canvas에 그릴 수 있다. # Body 안의 모든 요소를 Canvas에 그릴 경우 html2canvas(document.body, { backgroundColor: "#000000" // 배경 색 선택. 기본값 : 흰색 }).then(function(canvas) { var base64image = canvas.toDataURL("image/png"); window.open(base64image , "_blank"); // Open the image in a new window }); # 특정 div만 선택할 경우 ..
[JavaScript] popper.min.js.map 파일 (참고) stackoverfolw 에서 찾은 popper.min.js.map 파일
[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..
