FancyBox 1.3.4中的关闭按钮未显示

Question

我正在使用这段代码：

    <script type="text/javascript"> 
   $(document).ready(function() {
    $.fancybox(
        '<h2>Welcome!</h2><p> We are growing, so invite your friends!</p>',
        {
            'autoDimensions'    : false,
            'showCloseButton'   : true,
            'width'             : 350,
            'height'            : 'auto',
            'transitionIn'      : 'elastic',
            'centerOnScroll'    : 'true',
            'transitionOut'     : 'elastic'

        }
    );
});
</script>

由于某种原因，关闭按钮未显示。出了什么问题？

- user1116560

---

检查一下样本。问题也在那里吗？ - prongs

Answer 1

请检查 "fancybox.png" 文件（包含 fancybox 精灵图像）是否位于与 fancybox css 文件相同的目录中。如果问题只出现在 IE 中，请查看 此帖子。

- JFK

---

嗯，不知道我怎么错过了检查文件位置！谢谢！ - user1116560

Answer 2

当弹出层作为图层打开时，对于我来说没有显示，但是当作为iframe打开时可以正常工作。

在您的CSS中尝试以下内容：

#fancybox-close {
    display:inline !important;
}

对我很有效...

- user1524745

Answer 3

我在网上搜索了很长时间，因为没有关闭按钮或任何fancybox的属性显示。后来通过Chrome开发者工具(F12)实验发现两件事导致了这个问题:

1）fancybox文件被放置在一个子文件夹中，导致URL不匹配，所以我只是从一个名为JS的子文件夹中取出fancybox文件夹，并将其留在主根文件夹中。

2）在css中确保它不是url:(blahblah)，而是url(blahblah)，也就是说没有“:”。

3）仅使用url(fancybox_sprite.png)就可以正常工作，不需要添加完整路径，因为完整路径由于某种奇怪的原因无法工作。

希望对大家有所帮助！

- IMTHEKINGOFHEARTS