GreyBox是一个遮罩层的组件也称模式窗口或模态窗口(所谓模态窗口,就是指除非采取有效的关闭手段,用户的鼠标焦点或者输入光标将一直停留在其上的窗口),它运行以后可以产生不错的界面。类似于thinkbox,lightbox等。用于以一种别致的模式对话框方式展示页面,图片或者其它内容。这是它的官网:http://orangoo.com/labs/GreyBox/

使用步骤如下:第一步:把下载的文件解压,拷贝其中的greybox目录到项目的WebRoot根目录下第二步:在jsp页面中添加对greybox用的js和css文件的引用,代码如下:

<scripttype="text/javascript">//设置greybox的根目录 varGB_ROOT_DIR="./greybox/"; </script><scripttype="text/javascript"src="greybox/AJS.js"></script><scripttype="text/javascript"src="greybox/AJS_fx.js"></script><scripttype="text/javascript"src="greybox/gb_scripts.js"></script><linkhref="greybox/gb_styles.css"rel="stylesheet"type="text/css"/>

第三步:实现功能:

<%@pagelanguage="java"import="java.util.*"pageEncoding="GB18030"%><!—必须添加dtd--><!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head><title>MyJSP'index.jsp'startingpage</title><scripttype="text/javascript">//设置greybox的根目录 varGB_ROOT_DIR="./greybox/"; </script><scripttype="text/javascript"src="greybox/AJS.js"></script><scripttype="text/javascript"src="greybox/AJS_fx.js"></script><scripttype="text/javascript"src="greybox/gb_scripts.js"></script><linkhref="greybox/gb_styles.css"rel="stylesheet"type="text/css"/><scripttype="text/javascript">functionlogin(){ //GB_showCenter(caption,url,/*optional*/height,width,callback_fn) GB_showCenter("用户登录","/greybox/login.jsp",200,300,show); } functionshow(){alert("关闭");} </script></head><body><ahref="javascript:login()">登陆</a><scripttype="text/javascript">for(vari=1;i<16;i++){ varstr="<ahref='p_w_picpath/"+i+".gif'rel='gb_p_w_picpathset[p_w_picpath]'title=''><imgsrc='p_w_picpath/" +i+".gif'border='0'/></a>" document.write(str); if(i%6==0){document.writeln("<br>");} } </script></body></html>

附件:http://down.51cto.com/data/2359969