【问题标题】:fancybox with button helper and Thumbnail helper带有按钮助手和缩略图助手的fancybox
【发布时间】:2014-05-02 20:14:49
【问题描述】:

如何使用按钮助手和缩略图助手添加 fancybox?
是否可以将按钮(按钮助手)放在图像下方,以便我可以观看并选择我想看的内容?

按钮

$(document).ready(function() {
$(".fancybox-button").fancybox({
    prevEffect      : 'none',
    nextEffect      : 'none',
    closeBtn        : false,
    helpers     : { 
        title   : { type : 'inside' },
        buttons : {}
    }
});

});

和缩略图代码

$(document).ready(function() {
$(".fancybox-thumb").fancybox({
    prevEffect  : 'none',
    nextEffect  : 'none',
    helpers : {
        title   : {
            type: 'outside'
        },
        overlay : {
            opacity : 0.8,
            css : {
                'background-color' : '#000'
            }
        },
        thumbs  : {
            width   : 50,
            height  : 50
        }
    }
});

});


我对 JavaScript 有点陌生,我无法让它工作。
我想要做的是将它们混合在一起并将按钮放在底部

附:我还可以使用 fancybox 缩略图助手来处理 Youtube 视频吗?

【问题讨论】:

    标签: button fancybox thumbnails helper


    【解决方案1】:

    除了fancybox 的常规js 和css 文件之外,您还必须加载jquery.fancybox-buttons 和jquery.fancybox-thumbs js 和css 文件。它们位于 zip 文件的子目录“helpers”下。

    【讨论】:

    • 谢谢。但是fancybox按钮和缩略图代码是什么?(按钮和缩略图在一个代码中)我想要代码,从那里开始我想我可以处理它。谢谢
    • 您需要外部 js 和 css 文件以及代码。我看不出代码有什么问题,所以我认为您缺少加载文件,不是吗?
    • 好的,我尝试编辑外部 js 和 css 文件,以获取按钮助手和缩略图助手,但我找不到要编辑的内容以使其正常工作,我不确定位置在哪里:底部;代码应该去获取下面的按钮。我不擅长 javascript :(
    • 两个分开的东西: 1. 有一个(或两个)按钮和拇指,你需要 jquery js 文件和 fancybox js 和 css 文件 + thumbs js 和 css 文件 + 按钮 js 和 css 文件。 2.按钮的默认位置是在图像的顶部和底部的拇指。没有任何 API 选项可以更改任何(按钮或拇指)的默认位置,如果您对 jquery 和 css 不太满意,那么自定义可能会有点困难。您可能需要其他人为您做这件事(到目前为止我还没有)
    • 根据 v2.1.4,您可以选择拇指和按钮助手的位置。选项为top 或bottom。检查fancyapps.com/fancybox/#docs——找到Options for thumbnail helper和/或Options for button helper
    猜你喜欢
    • 2012-02-15
    • 1970-01-01
    • 1970-01-01
    • 2013-02-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-09-09
    相关资源
    最近更新 更多