Question

我在gtmetrix.com上搜索了我的网站。

建议为所有图片添加图片尺寸。问题是，我需要一些自动添加这些的方法，所以如果图像发生变化，则会更新尺寸。

我有什么

<img src="bla.png">

我想拥有什么

<img src="bla.png" width="{width of image}" height="{height of img}">

有没有php方式或jquery方式来做到这一点？对于wordpress网站。

Answer 1

PHP：

<?php
list($width, $height) = getimagesize("bla.png");
echo "<img src='bla.png' width='$width' height='$height'>";
?>

Answer 2

您可以使用image onload事件来计算图像的尺寸。纯粹的javascript方法，类似于;

var image = new Image();

image.onload = function()
{
  //after load complete you will get the image dimensions here from 
  //image.width and image.height
}

image.src = 'image url';

Answer 3

如果要动态输出图像，在php中它是getimagesize($file)。

Answer 4

你应该用PHP而不是javascript来做。如果你用jQuery / javascript添加它，加载后会添加宽度和高度。指定宽度和高度的主要原因是让引擎更快地渲染页面。如果在加载后添加它将没有任何帮助。

您可以直接在图片代码中使用getimagesize()返回的数组的索引3。它包含一个高度=“yyy”width =“xxx”的字符串，可以直接在IMG标签中使用。

<?php
    list($width, $height, $type, $attr) = getimagesize("file.png");
    echo "<img src='file.png' $attr />";
?>

您可以访问http://php.net/manual/en/function.getimagesize.php了解有关此功能的更多详情。

自动将图片尺寸添加到<img/>

4 个答案: