javascript 获取图片尺寸及放大图片_javascript技巧

1)获取图片尺寸

复制代码 代码如下:

<script> <BR>function getWH(t){ <BR>//DOM属性 <BR>console.log("width="+t.width);//200 <BR>console.log("height="+t.height);//300 <BR>//操作样式 <BR>console.log("styleWidth="+t.style.width);//空 <BR>console.log("styleHeight="+t.style.height);//空 <BR>} <BR></script>

2)获取图片尺寸(不设置宽高)

复制代码 代码如下:

<script> <BR>function getWH(t){ <BR>//DOM属性 <BR>console.log("width="+t.width);//200 <BR>console.log("height="+t.height);//300 <BR>//操作样式 <BR>console.log("styleWidth="+t.style.width);//空 <BR>console.log("styleHeight="+t.style.height);//空 <BR>} <BR></script>

我们只要不在style中显式地设置它，宽高永远为空！

3)放大图片：

这里我们利用了IE的私有属性防止图片放大失真严重！

复制代码 代码如下:

<script> <BR>function getWH(t){ <BR>t.width *= 2; <BR>t.height *= 2; <BR>//每点击一次，宽高放大一倍 <BR>} <BR></script>

4)在FF与谷歌中，我们还可以用naturalWidth与naturalHeight取得图片的原大小！

复制代码 代码如下:

<script> <BR>function getWH(t){ <BR>console.log("width="+t.naturalWidth); <BR>console.log("height="+t.naturalHeight); <BR>t.width = t.naturalWidth * 2; <BR>t.height = t.naturalHeight * 2; <BR>} <BR></script>

naturalWidth和naturalHeight只是只读属性，不能用来设置图片的大小，不能持续放大。