如何让图片自动适应网页的大小

时间:2021-05-02

我们在做网页时往往要用图片来说明一些问题,但是有些图片尺寸过大,把用来布局的表格给撑大了,如果每个图片都修改其尺寸,又显得非常麻烦,下面给出利用Javascript结合CSS属性来控制图片大小的方法。

在IE5.5以上版本中,用JS判断图像的尺寸,如果图像的尺寸大于一个定值时,用ZOOM进行缩放:

首先,建立一个名为zoom.htc 的behavior文件,并写入如下代码:

<public:attach event="oncontentready"" onevent="zoom()" /><script language="javascript">function zoom(){ if(this.width>700) this.style.zoom = 1/(width/700); //ZOOM= 1 除以(宽除以规定宽度)}</script>

其次,在网页中加入如下代码:

<style> .hyperlook img { behavior:url('zoom.htc')} //注意ZOOM.htc的路径 </style>

最后,在需要控制的地方的前后加入:<div class="hyperlook"> </div>

怎么样,测试一下效果如何吧,但是以上解决方案只在ie5.5以上有效。

本文源自:翔宇亭——IT乐园(http://www.biye5u.com),转载请保留此信息!

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章