【问题标题】:How can I stop fancybox from resizing?如何阻止fancybox调整大小?
【发布时间】:2015-06-26 10:48:10
【问题描述】:

我是初学者,所以我对编码的了解有限。我正在尝试创建一个使用fancybox2 作为其图片库的网站。我为每张照片添加了 Facebook 点赞按钮和 Facebook 评论框。这是我的代码:

$(".fancybox").fancybox({


beforeShow: function () {
    if (this.title) {
    currentHref = this.href;

    this.title += '<br /> <br/>'; // Line break after title


    this.title += '<div class="fb-like" style="margin:0; padding:0" data-href="' + currentHref + '" data-width="400" data-layout="standard" data-action="like" data-show-faces="false" data-share="false"></div>';

    this.title += '<br />'; // Line break after title

    this.title += '<div class="fb-comments" data-href="http://mundonimona.com/' + currentHref + '" data-num-posts="2" data-width="400"></div>';
    }
},
afterShow: function () {
    FB.XFBML.parse();


},
helpers: {
    title: {
        type: 'inside'
    }
}

});

http://jsfiddle.net/brewhildah/999Ly4vm/9/

Facebook 的点赞和评论框在网站上运行。问题是加载 Facebook 插件后照片的大小正在调整。它们都变小了。如何确保即使在 Facebook 内容加载后幻灯片也不会调整大小(以便查看照片并从一张幻灯片移动到另一张幻灯片会顺利进行)。

感谢您的帮助!

【问题讨论】:

  • 我对fancybox不熟悉,但似乎动态计算大小的某些原因导致了这种情况。如果您将 fitToView 设置为 false,然后为灯箱定义一个 maxWidth,它应该可以在不调整宽度和高度的情况下工作,它只会调整高度的大小

标签: javascript jquery facebook fancybox-2


【解决方案1】:

您可以结合fitToViewmaxWidth API 选项来实现:

$(".fancybox").fancybox({
    fitToView: false,
    maxWidth: "85%",
    // other API options
});

查看你的分叉JSFIDDLE

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2021-02-05
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-08-11
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多