阿杰

记录生活中的锁事

« 十全九美主题曲mp3试听世上最可怕的是坚持 »

css中控制图片的缩放,并加入指定链接

在使用css之前,我的做法都是在图片的img标签之后加上控制width和height的数值,这样很不方便。

使用css可以很容易的控制页面中某个指定标签中的img的大小缩放,虽然目前IE对这段代码的兼容性不是很好,不过多数的时候显示是正常的。

代码如下

img{max-width:700px;CURSOR: hand;width:expression(onreadystatechange=function(){if(this.width>700)this.width=700;});}

这样缩放了图片大小,限制了宽度为700,而大于700时,则自动缩小为700

想打开图片链接当然答案是肯定的,在css中也可以有这一句

ttt:expression(onclick=function(){window.open('pic='+this.src)})

 

加入前边那句的话就是

img{max-width:700px;CURSOR: hand;width:expression(onreadystatechange=function(){if(this.width>700)this.width=700;});ttt:expression(onclick=function(){window.open(this.src)})}

 

这样一来,当鼠标点击图片时,就打开新窗口进入图片的url了

如果不想直接打开图片url而是使用一个showpic的页面?

同样是肯定的,可以。代码如下,

img{max-width:700px;CURSOR: hand;width:expression(onreadystatechange=function(){if(this.width>700)this.width=700;});ttt:expression(onclick=function(){window.open('/showpic.html?pic='+this.src)})}

理论上来说,不使用绝对路径也是可以的,不过,如果你的所有子页面都在根目录下,你完全可以不考虑路径,我想很少有人把子页面全部放在根目录下吧,呵呵。



原创文章如转载,请注明:转载自百奥谷 [ http://www.baiwugu.com ]
本文链接地址:http://www.baiwugu.com/post/234.html
  • 相关文章:

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

最新评论及回复

最近发表

Powered By Z-Blog 1.8 Devo Build 80201 

Copyright 2008 阿杰的博客 Some Rights Reserved.