fancybox 最基本的使用步骤

初步使用
第一步 :引用js和样式

第二步 :设定要触发显示的元素(a标签,链接href指向div的id)
<div><a href=”#adddivtest” id=”addbtndiv”>测试</a></div>

第三步: 设定要触发后显示在面板里面的内容块(一般div,必须有2层包装)
<div style=”display:none;”>
<div id=”adddivtest”>
<div class=”title”>任务类型:</div>
<div class=”title”>任务类型:</div>
<div class=”title”>任务类型:</div>
</div>
</div>

第四步:js加载时加载/*弹出框js*/(此时使用的id是a标签的id而不是div的id)
function () {
/*弹出框js*/
$(“#addbtndiv”).fancybox({
‘autoDimensions’: false,
‘centerOnScroll’: true,
‘scrolling’: false,
‘width’: 480,
‘height’: 380
});

}

此时最简单的面板已经可以触发并显示了,接下来就是面板中加载数据什么的了。

微信公众号:rizhuti
关注我们,获取更多的全网素材资源,有趣有料!
12000人已关注
分享到:
赞(0) 打赏

评论抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏