时间戳

首页 > 解决方案 > 只接受小于 1920x1080 的照片

javascript - 只接受小于 1920x1080 的照片

问题描述

我如何只接受小于 1920x1080 的照片（来自文件资源管理器）。否则，我的整个网页都会被一张图片淹没。这是我导入照片的代码：

html:

<input type="file" id="file" accept="image/png, img/jpeg">

Javascript：

    function Read(){
    var file = document.getElementById("file").files[0];
    var reader  = new FileReader();
    reader.onload = function(e)  {
        var image = document.createElement("img");
        // the result image data
        image.src = e.target.result;
        document.body.appendChild(image);
  }
    reader.readAsDataURL(file);
  }

标签： javascripthtml

解决方案

您无需检查图像大小。你可以只使用 css 来调整图像大小，这样它就不会填满页面。

img {
    width: 100%;
    max-width: 300px;
    /** height will be automatically calculated */
}

这样图像不会超过 300 像素，也不会填满整个页面。

推荐阅读