javascript - Fancybox & carouFredSel：fancybox 出现但被灰色背景覆盖

Question

我用 carouFredSel 和 Fancybox 创建了网页。一切正常，但 Fancybox 显示为图像被灰色阴影覆盖。花式盒子的 html 代码：

<a href="/images/front/1.jpg" class="lightbox_trigger" rel="fancybox1" >
<a href="/images/front/2.jpg" class="lightbox_trigger" rel="fancybox2" >

和一个js：

$('#carousel  a.lightbox_trigger').fancybox({
    cyclic  : true,
    opacity: true,
    onStart : function() {
        $('#carousel').trigger("pause");
    },
    onClosed: function() {
        $('#carousel').trigger("play");
    }
});

更新 1

从CSS开始：

.tooltip {
  font-weight: bold;
  font-size: 1.1em;
}

.tooltip h3 {
  color: red;
}

.tooltip h4 {
  color: green;
}

在/fancybox.cssz-index 中设置为大约1100

Answer 1

我必须创建完整的回调并设置元素的不透明度：

$(element).fancybox({
    cyclic  : true,
    opacity: true,
    overlayOpacity: 0.9,
    zoomSpeedIn: 1000,
    onStart : function() {
        $('#carousel').trigger("pause");
    },
    onClosed: function() {
        $('#carousel').trigger("play");
    },
    onComplete: function(){
        $('#fancybox-wrap').css('margin-top', '-50px')
        var fb = $("#fancybox-content")
        $(fb).css({'opacity': '1', 'height': '520px'})

    }
});