可自动控制图片大小,自动加新窗口打开链接,自动居中正文中的图片的强悍代码 ^_^
效果预览:
http://www.7ibu.com/pcenter/meinv/2006/1110/339.htm
使用方法:
保存下面代码为imgzoom.htc,找个目录放好,我是放在js目录下的;
或者点这里保存:
http://www.7ibu.com/js/imgzoom.htc
<script language="javascript"> var _width = element.width; var _hieght = element.height; var _maxpixel = _width; var _which = "w"; var maxwidth = 700; var maxheight = 525; element.onmousewheel = test; if (element.width > maxwidth) { element.width = maxwidth; element.removeAttribute("height"); } if (element.parentElement.tagName != "A"){ var _html = ""; _html += "<div align=center><a href=\""+element.src+"\" target=\"_blank\">"; _html += element.outerHTML; _html += "</a></div>"; element.outerHTML = _html; } function test() { return zoomimg(element) } function zoomimg(pic){ var zoom=parseInt(pic.style.zoom,10)||100; zoom+=event.wheelDelta/12; if (zoom>0) pic.style.zoom=zoom+'%'; return false; } </script>
|
第二步,在需要控制的页面(如TSYS的新闻页模板)里加入下面的代码,或者写到CSS里去,
<style type="text/css"> #articlebody img { behavior: url("/js/imgzoom.htc"); } </style> |
然后content显示的地方套个层,如:<div id="articlebody">$content$content$lt;</div>
这样就OK了,很简单,具体大小设置可以在imgzoom.htc里修改相应代码,相信大家都看的懂,这是我目前发现的控制正文图片大小最好的了,有更好的,欢迎大家提供分享!~
另外,这段代码有个BUG,就是图片不能用<P>属性来控制,代码已经默认设置图片为居中了,比如说下面这段代码就会出现脚本错误.
<p align=center> <img src="http://www.im286.com/images/im286/logo.gif"> </p> |
正确的应该是这样:
<img src="http://www.im286.com/images/im286/logo.gif"><br> |