thickbox是基于JQ写的UI对话窗口小部件. 它可以用来展示单一图片, 若干图片, 内嵌的内容, iframed的内容, 或以 ajax 的混合modal 窗口!功能非常强大,我在项目中也在不少地方应用到!
http://www.harborhousehome.com/Product/6/100095.html
点击图片下面的白色小图标就可看见效果!
目前最新版应该是3.1,官方演示及教程地址为http://jquery.com/demo/thickbox/,了解JQ插件的人不用我介绍了吧,然而这里只是介绍了简单的应用,在某些时候我们需要手动去打开一个窗口,那怎么做呢?
分析thickbox源码就可以看出,它是使用tb_show()来弹出的,我们也可以单独调用它
先试试效果
JavaScript代码
- function prompt() {
- tb_show("HarborHouse", "http://www.harborhousehome.com?TB_iframe=true&height=550&width=900", false);
- }
第一个参数为该弹出层的标题,第二个是弹出层嵌套网页的URL,第三个是是否是显示一组图片 ,如A标签里用了rel(rel:多图集合的rel属性,不是图集就直接传递false);
如果要移除弹出框,在弹出框的内部这样写:window.parent.tb_remove();
如果要弹出窗口成模态,那么加一个参数modal=true,
TB_iframe参数为是否内嵌框架弹出!这样可以在弹出窗口内部做页面跳转了!