WEB

· WEB/CSS
[CSS] 테이블 자동 줄바꿈하는 방법 테이블 자동 줄바꿈 하려면 태그에 "table-layout: fixed" 속성을 추가해서 테이블 크기를 고정시킨 후 줄바꿈을 하려는 태그 , , 등에 "word-wrap: break-word;" 속성을 추가하면 된다. table { table-layout: fixed; } td { word-wrap: break-word; } ※ word-wrap 속성 종류 normal : 일반 줄바꿈 지점에서만 줄을 바꿈 ( default ) break-word : 줄을 바꿀 만한 지점이 없을 경우 임의의 지점에서 줄을 바꿈. [참고] https://www.w3schools.com/cssref/css3_pr_word-wrap.asp
· WEB/CSS
아래와 같이 더블 클릭 후 파란색 선택되는 기능을 막는 방법 span.no_selection { -webkit-user-select: none; /* webkit (safari, chrome) browsers */ -moz-user-select: none; /* mozilla browsers */ -khtml-user-select: none; /* webkit (konqueror) browsers */ -ms-user-select: none; /* IE10+ */ } [출처] stackoverflow
· WEB/Electron
[electron] 특정 위치에서만 메뉴(context-menu) 보이도록 설정하는 방법 예) 아이디(id)값이 imageDiv 인 곳에서만 마우스 오른쪽 클릭 메뉴가 보이도록 설정하기 const { Menu, MenuItem } = remote; // 메뉴 생성 const menu = new Menu(); menu.append(new MenuItem({ label: 'Download', click() { // 메뉴 선택에 따른 동작(이벤트) 정의 console.log('Download!') } })) // 이벤트 리스너 생성 window.addEventListener('contextmenu', (e) => { e.preventDefault() // 마우스 오른쪽 버튼 클릭한 위치(target)의 아이디..
[JavaScript] html2canvas 사용 할 때, transform 때문에 이미지가 잘린 경우. 해결방법 ※ html2canvas사용방법은 이 글을 참고하세요. 아래와 같이 imageDiv(검은 영역)를 canvas에 그린 후 캡쳐할 경우 빨간색 상자가 transform이 되어 있기 때문에 아래와 같은 이미지가 아닌 오른쪽과 같이 빨간색 상자가 한쪽으로 치우친 형태로 캔버스에 그려진 후 캡쳐된다. 초록색 영역만 canvas에 그려진 것이다. 해결방법은 imageDiv에 설정되어 있는 transform을 제거 한 후 캡쳐하고 다시 transform을 설정해 주면 된다. var imageDiv = document.getElementById("imageDiv"); // 캡쳐 후 원래 위치로 복구 하기..
· WEB/Node.js
[Node.JS] ffmpeg 영상 코덱 변경 방법 fluent-ffmepg 를 이용해서 코덱 변환이 가능하다. 설치 $ npm install fluent-ffmpeg 예) h264 코덱으로 변경하여 영상 실행* h264으로 변경할 경우 libx264로 코덱을 적어주면 된다. const FfmpegCommand = require('fluent-ffmpeg'); const video = document.querySelector("#video"); let file = "test.mov" # 변경 전 파일 let convert = "output.mov" # 변경 후 파일 FfmpegCommand(file) .videoCodec('libx264') .format('mov') .on('error', functio..
· WEB/Node.js
[Nodejs] 폴더 없으면 생성하도록 하는 방법 - 가장 간단한 방법 const fs = require('fs'); !fs.existsSync(dir) && fs.mkdirSync(dir); - 에러 처리를 추가한 방법 fs.mkdir(dir, err => { if (err && err.code != 'EEXIST') throw 'up' console.log("Already Exists!") }) - 폴더 없을 경우 모두 생성 ( 하위 폴더 생성 ) `mkdirp` 를 이용해서 `mkdir -p` 수행 const mkdirp = require('mkdirp'); mkdirp(dir, function (err) { if (err) console.error(err) }); [참고] code.i-harnes..
S0PH1A
'WEB' 카테고리의 글 목록 (13 Page)