Javascript如何设置我自己的img宽度和高度（调整大小）

Question

我正在使用此javascript代码显示要上传的所选图片：

    var input = document.getElementById("images"), 
    formdata = false;

function showUploadedItem (source) {
    var list = document.getElementById("image-list"),
        li   = document.createElement("li"),
        img  = document.createElement("img");
    img.src = source;
    li.appendChild(img);
    list.appendChild(li);
}  

HTML：

 <span class="span4">
   <div id="response"></div>
   <ul id="image-list">
   </ul>
 </span> 

如何编辑代码，以便选择和显示的图像以400px的原始尺寸显示。示例：

谢谢！

Answer 1

你可以说：

img.style.width = "400px";
img.style.height = "400px";

Answer 2

CSS：

#image-list img{
   height: 400px;
   width: auto;
}

如果您真的想要实际调整图片大小...，如果您的图片在服务器上，则可以将其发送到画布，执行调整大小并将其作为 base64 编码字符串...

有趣的阅读：

Answer 3

您可以使用样式以％设置宽度和高度：

img.style.width="100%";

Answer 4

您还可以为此图像添加css类（调整大小）

img.resize{
    width:540px; /* you can use % */
    height: auto;
}

Answer 5

包括线......

img.style.width='400px';

img.style.height='400px';

或者你想要的任何尺寸。

Answer 6

创建对象img后，您可以使用以下内容：

img.width = "400";
img.height = "400";