怎么样弹出与图片同样大小的窗口？
在论坛上问过这个问题的不在少数，以前可以用无边窗口，自从IE6.0的SP1出现以后无边窗口成了coder唾骂M$的又一理由，扯远了，收回。在实现这个其实并不复杂，主要思路是用window.open()方法打开一个窗口，然后再根据图片的大小resizeTo()窗口大小，必要时再用moveTo()方法调整窗口位置。现在问题在于如何获取图片的大小。
方法一。我们知道，DHTML里有个Image()对象，只要设置图片源src后就可以用obj.width和obj.height获取图片的宽和高，这两个数据有了之后就可以给window.open()里控制窗口大小的参数一个定值了，不过要注意，要把窗口边框、标题栏高度计算在内。具体实现过程和方法参考这里： http://www.blueidea.com/tech/program/2003/104.asp
方法二。如果你稍微细心一点，应该会发现，当不指定图片的大小时，图片默认显示原始大小，这时用obj.width和obj.height取到的也是图片的宽和高的真实值。所以可以先用window.open()方法打开一个空窗口，再以流方式给窗口写入调用图片的代码，在图片加载完后有个onload方法，用它触发resizeTo()改变窗口大小。代码如下：
<script>
function fiximgwin(url)
{
var imgwin=window.open('','img','width=50,height=50')//打开一个空白窗口，并初始化大小
imgwin.focus()//使窗口聚焦，成为当前窗口
var HTML="<html>/r/n<head>/r/n<title>图片浏览</title>/r/n</head>/r/n<body leftmargin=/"0/" topmargin=/"0/">/r/n<img src=/""+url+"/" οnlοad=/"window.resizeTo(this.width+10,this.height+36);window.moveTo((screen.width-this.width)/2,(screen.height-this.height)/2)/">/r/n</body>/r/n</html>"//这里是关键代码，在图片加载完后调用resizeTo()和moveTo()方法调整窗口大小和位置
var doc=imgwin.document
doc.open("text/html","replace") //指定文档的多用途网际邮件扩充协议
doc.write(HTML)//向空白窗口写入代码
doc.close()//关闭输入流，并强制发送数据显示。
}
</script>
<img οnclick=fiximgwin("images/wfsr.gif") src=wfsr.gif>
<img οnclick=fiximgwin("banner.gif") src=images/logo.gif>
代码就这么多，如果网站里需要用到这种效果的地方很多，可以考虑把它做成 HTC，大图的地址可以通过自定义属性方式确定。
在论坛上问过这个问题的不在少数，以前可以用无边窗口，自从IE6.0的SP1出现以后无边窗口成了coder唾骂M$的又一理由，扯远了，收回。在实现这个其实并不复杂，主要思路是用window.open()方法打开一个窗口，然后再根据图片的大小resizeTo()窗口大小，必要时再用moveTo()方法调整窗口位置。现在问题在于如何获取图片的大小。
方法一。我们知道，DHTML里有个Image()对象，只要设置图片源src后就可以用obj.width和obj.height获取图片的宽和高，这两个数据有了之后就可以给window.open()里控制窗口大小的参数一个定值了，不过要注意，要把窗口边框、标题栏高度计算在内。具体实现过程和方法参考这里： http://www.blueidea.com/tech/program/2003/104.asp
方法二。如果你稍微细心一点，应该会发现，当不指定图片的大小时，图片默认显示原始大小，这时用obj.width和obj.height取到的也是图片的宽和高的真实值。所以可以先用window.open()方法打开一个空窗口，再以流方式给窗口写入调用图片的代码，在图片加载完后有个onload方法，用它触发resizeTo()改变窗口大小。代码如下：
<script>
function fiximgwin(url)
{
var imgwin=window.open('','img','width=50,height=50')//打开一个空白窗口，并初始化大小
imgwin.focus()//使窗口聚焦，成为当前窗口
var HTML="<html>/r/n<head>/r/n<title>图片浏览</title>/r/n</head>/r/n<body leftmargin=/"0/" topmargin=/"0/">/r/n<img src=/""+url+"/" οnlοad=/"window.resizeTo(this.width+10,this.height+36);window.moveTo((screen.width-this.width)/2,(screen.height-this.height)/2)/">/r/n</body>/r/n</html>"//这里是关键代码，在图片加载完后调用resizeTo()和moveTo()方法调整窗口大小和位置
var doc=imgwin.document
doc.open("text/html","replace") //指定文档的多用途网际邮件扩充协议
doc.write(HTML)//向空白窗口写入代码
doc.close()//关闭输入流，并强制发送数据显示。
}
</script>
<img οnclick=fiximgwin("images/wfsr.gif") src=wfsr.gif>
<img οnclick=fiximgwin("banner.gif") src=images/logo.gif>
代码就这么多，如果网站里需要用到这种效果的地方很多，可以考虑把它做成 HTC，大图的地址可以通过自定义属性方式确定。
8196
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
