码迷,mamicode.com
首页 > Web开发 > 详细

jQuery.fancybox 学习笔记

时间:2015-05-30 07:08:37      阅读:333      评论:0      收藏:0      [点我收藏+]

标签:fancybox

设置堆叠顺序(z-index)

用bootstrap+jquery开发前端,需要给弹出的模态框中的图片,增加单击图片,可以对图片进行放大预览的功能,如果仅仅绑定了fancybox()函数,如:

$("a.fancybox").fancybox();

而没有配置z-index的值,可能出现弹出层在模态框的后面的情况,如:
技术分享

解决方案:
配置fancybox的覆盖层(overlay)的堆叠顺序(z-index),大约为12500
最终实现代码如下:

$("a.fancybox").fancybox({
  helpers: {
    overlay : {//z-index 仅能在定位元素(position=absolute||fixed)上凑效 ,此时 z-index值在11250左右
      css : {position: "fixed", "z-index": 12500}
    }
  }
});

效果:
技术分享

jQuery.fancybox 学习笔记

标签:fancybox

原文地址:http://blog.csdn.net/liangzai_cool/article/details/46252769

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!