点击图片 放大查看

$(document).delegate("#imageOne","click",function(){
debugger ;
if($(this).attr('class')=='fd'){
$(this).removeClass("fd").css("width","150").css("height","100");
$.unblockUI();
}else{
var image =$(this).css("width","450").css("height","500").addClass("fd");

onBlock(image);
}

});

上边的js 加在  初始化 fucntion 中  (注:delegate 是绑定未来时间，当有delegate 的时候，jsp页面会重新加载一遍，所以用js 后来加上去的事件 也可以使用。)

function onBlock(obj){
var windowWidth = document.documentElement.clientWidth;
var windowHeight = document.documentElement.clientHeight;
var popupHeight = obj.height();
var popupWidth = obj.width();
debugger ;
$.blockUI({
message : obj,
css : {
width : '',
height : '',
overflow : 'aoto',
left : (windowWidth - popupWidth) / 2,
top : (windowHeight - popupHeight) / 2}
});
$(".blockUI").css('cursor', 'default');
}

放在 初始化fucntion 外面

然后还要把  jquery.blockUI.min.js   js 引入

只需要改变 id 上文中的 “#imageOne” 即可。