Question

我有一个动态改变图像的img元素。我总是希望在整个维度上展示这个图像。

所以，我想，我要在img标签中动态更改宽度和高度属性。

我怎样才能在php或javascript中执行此操作？

Answer 1

只需省略宽度和高度属性（和样式）即可。如果您之后需要知道它，可以从计算出的CSS中获取它。

Answer 2

你不能没有宽度和高度尺寸吗？据我所知，如果你没有定义宽度和高度，浏览器会显示整个完整大小的图像。大多数现代浏览器都是。

Answer 3

假设您关心alt，height和width属性（您应该），从javascript数组中读取图像属性可能非常适合您。这是jQuery插入随机图像的一个例子，你可以将随机图像逻辑交换出你想要渲染的任何类型的幻灯片等。

$(document).ready(function() {

  var imageArray = new Array ();
  imageArray[0] = new Array ( "jungle.jpg",   "http://rmportal.net", "Jungle", "400", "300");
  imageArray[1] = new Array ( "mountain.jpg", "http://rmportal.net", "Mountain" , "350", "290");
  imageArray[2] = new Array ( "ocean.jpg",    "http://rmportal.net", "Ocean" , "442", "530");

  var max = imageArray.length;
  var num = Math.floor((Math.random() * max));

  var hstring = "<a href='" + imageArray[num][1] + "'><img src='" + imageArray[num][0] + "' alt='" + imageArray[num][2] +  "' height='" imageArray[num][3] +  "' width='" + imageArray[num][4] + "' /></a>"

  $('#my-image').html(hstring);

});

Answer 4

如果您希望在HTML中保留width和height属性，那么在PHP中，您需要GD库中的getimagesize方法。

Answer 5

如果页面加载了图像的宽度和高度作为属性包含在源中，第一次更改源时使用removeAttribute('width')和'height'。

如果您不希望在慢速下载过程中页面“崩溃”，请预先加载图片并在 img.complete为真后更改src ，如果是缓存，或图像onload触发后。

如何在<img/>标记内始终以完整维度显示图像

5 个答案: