html2canvas 플러그인 관련
조회수 703회
$(function(){
var captureBox = document.getElementById('img-capture-contents');
// 흑백버전
$('#grayBtn').click(function(){
$(captureBox).toggleClass('grayScale-ver');
});
$("#btn-capture").on('click', function (e) {
var today = new Date();
today = getFormatDate(today);
html2canvas(captureBox).then(function (canvas) {
if (navigator.msSaveBlob) {
var blob = canvas.msToBlob();
return navigator.msSaveBlob(blob, today+'.jpg');
} else {
var el = document.getElementById("target");
el.href = canvas.toDataURL("image/jpeg");
el.download = today+'.jpg';
el.click();
// el.removeAttribute("href");
}
});
});
});
html2canvas 플러그인을 사용하여 버튼 클릭 시 특정 영역이 캡쳐가 됩니다.
특정영역 안에 있는 모든 요소에 css로 filter: grayscale(100%); 적용했는데.. 캡쳐 후, 다운받은 이미지를 보면 grayscale이 적용되지 않은 이미지가 다운로드 됩니다 뷰페이지에서는 grayscale 적용된걸로 보이는데..
다운받은 이미지도 grayscale 버전으로 다운받고 싶으면 어떻게 해야하는 지 도움요청할 수 있을까요?
구글 검색 등 통해서 이것저것 테스트해봤는데 해결이 안되네요ㅠㅠㅠ
-
(•́ ✖ •̀)
알 수 없는 사용자
댓글 입력