jquery - 仅针对视频将 fancybox 标题样式更改为 "outside"

Question

所以我有一个图像库和一个视频。我希望图像具有“上方”类型的标题，视频具有“内部”类型的标题。下面的代码是我尝试过的，但视频标题仍然是“结束”，并且单击视频缩略图只会导致 fancybox 覆盖层闪烁。如果我删除 fancybox-media 定义，视频缩略图就可以正常工作。

<script type="text/javascript">
    $(document).ready(function() {
        $(".fancybox").fancybox({
            margin: 10,
            padding: 10,

            helpers : {
                title : {
                    type : 'over'
                },
                media : {}
            }
        });

        $('.fancybox-media').fancybox({
            helpers : {
                title : {
                    type : 'inside'
                }
            }
        });

    });
</script>

然后在 HTML 中:

<a class="fancybox fancybox-media" href="http://www.youtube.com/v/EIyixC9NsLI?hd=1&autoplay=1" data-fancybox-group="gallery" title="Here is a video."><img class="thumb" src="tn_video.png" alt="" /></a>

答案与 .attr('rel', 'gallery') 有关系吗？我不太明白那是做什么的。

Answer 1

您是否尝试创建 2 个单独的 fancybox 函数调用，其中一个用于 fancybox fancybox-media，因为在那里，它们可能会相互重叠。

类似这样的东西(未经测试):

    $(".fancybox").fancybox({
        margin: 10,
        padding: 10,

        helpers : {
            title : {
                type : 'over'
            },
            media : {}
        }
    });
    $(".fancybox-media").fancybox({
        margin: 10,
        padding: 10,

        helpers : {
            title : {
                type : 'inside'
            },
            media : {}
        }
    });