求个浏览图片的特效，求大神给个例子或说一下用什么插件可以解决这个问题

Question

在jsp页面里实现查看图片的效果，就是类似于QQ的聊天窗口查看图片的效果，
点击图片出来个带关闭按钮的框，滚动滚轮图片能放大
求个demo或者能实现这个效果的插件图片插件jsp图片放大 浏览

Answer 1

没见到过这样的插件 很难找到完全符合你要求的插件的吧  貌似
function createScreen(src/*屏蔽层上显示的图像地址*/,parentDom/*屏蔽层的父元素*/){
var div=document.createElement("div");
var screenStyle=getScreenStyle();
parentDom=parentDom||document.body;
var style={
'width':screenStyle.width+"px",
'height':screenStyle.height+"px",
'position':'fixed',
'left':'0px',
'top':'0px',
'opacity':.6,
'filter':'alpha(opacity=60)',
'zIndex':5000,
'backgroundColor':'black'
}
setStyle(div,style);

var img=new Image();
img.src=src;
//需要在图片加载完毕后创建屏蔽层 否则无法计算图片高宽
img.onload=function(){
style={
'position':'fixed',
'left':(screenStyle.width-img.width)/2+"px",
'zIndex':5001,
'top':(screenStyle.height-img.height)/2+"px"
}
setStyle(img,style);


var text=document.createElement("div");
//text.innerHTML='数据正在加载..';
style={
'position':'fixed',
'zIndex':5002,
'top':parseInt(img.style.top)+parseInt(img.height)+"px",
'left':(screenStyle.width-img.width)/2-20+"px",
'color':'white'
}
setStyle(text,style);


parentDom.appendChild(div);
parentDom.appendChild(img);
parentDom.appendChild(text);
screenDiv=div;
screenImage=img;
screenParent=parentDom;
//当窗口大小发生变化时重新计算
window.onresize=function(){
screenStyle=getScreenStyle();
style={
'width':screenStyle.width+"px",
'height':screenStyle.height+"px"
}
setStyle(div,style);

style={
'left':(screenStyle.width-img.width)/2+"px",
'top':(screenStyle.height-img.height)/2+"px"
}
setStyle(img,style);


style={
'top':parseInt(img.style.top)+parseInt(img.height)+"px",
'left':(screenStyle.width-img.width)/2-20+"px"
}
setStyle(text,style);

}
}
img.onerror=function(){
alert('图片加载错误');
}
img.onabort=function(){
alert('图片加载失败');
}
}  
滚动放大缩小监视onscroll事件改变img的width 和height试试