我正在开发一个使用DOM 到图像库和FileSaver.JS来保存图像的 meme 编辑器 Web 应用程序。
使用 PC 屏幕保存图像有些好,但使用手机屏幕保存时,显示的图像是像素化图像。
这是div
我需要保存的:
<div class="col-md-6">
<div id="theUserMeme">
<div class="row">
<p id="memeWords">
People struggles with making memes for free <br>
Instant Memes:
</p>
</div>
<div class="row">
<img id = "memeImage" src="images/init meme.jpg">
</div>
</div>
</div>
另外,这是我保存图像的函数的代码:
function generateMeme(){
var options = {
quality: 1,
};
var alertMsg = "*********** Please Read *********** \n";
alertMsg += "Image must be saved in your device \n";
alertMsg += "If you didn't get the image that you want try again, otherwise, feel free to get in touch with us \n";
alertMsg += "*********** Thanks for reading ***********";
domtoimage.toBlob(document.getElementById('theUserMeme'), options)
.then(function (blob) {
alert(alertMsg);
window.saveAs(blob, 'instant meme.jpeg');
});
}
此外,这是我的部分 meme 的 CSS 代码:
#memeWords{
font-size: 25px;
}
#theUserMeme{
background-color: white;
}
可能是什么问题?为什么会这样?如何解决?