fancybox 的使用

实现web 页面弹出层，以前用的是colorbox，现在新项目准备用更绚丽的fancybox。

其实fancybox官网写的很明白，也很详细，简单的使用就不介绍了，大家可以去看官网的帮助文档。

地址：http://fancyapps.com/fancybox/

我这里记录一下，遇到的问题。首先，我用到了 显示图片，这个很简单，还有就是显示iframe，最后我想显示一个div，div里面是组织结构树

这个fancybox没有说明如何显示。

最后是这样解决的：

<button id="trigger_tree" href="#treeDiv" style="">弹出框</button>
	<div style="display:none;">
	 <div id="treeDiv" class="popupDiv">
	    <div class="toolBar">
	       	 <button type="button" id="submit" class="btControls bt_complete">确定</button>
	    </div>
		<ul id="dataTree" class="ztree"></ul>
	 </div>

 

$(function(){
	$('#trigger_tree').fancybox({
		padding : 0,
		autoSize:true,
	});
});

 

大家注意到了吗，button的href属性，指定连接的是div，这样就能显示了！

对了 可能大家下载完插件，放入工程内发现显示的遮罩没有颜色，是需要修改他的css样式的。