Question

嗨，我知道很多人已经被问过这个问题，但我找不到能帮到我的答案。

我所拥有的是一个网页，其中包含许多使用fancybox显示大图片的图库。我想要的是将twitter和facebook之类的按钮包含在图像的fancybox叠加层中。

这是页面：http://studiovsf.nl/portretten-voorbeelden.html

我首先尝试使用JSFiddle，一切都很好（http://jsfiddle.net/kmLWf/247/）

HTML：

<a class="fancybox" title=" " data-fancybox-group="gallery1" href="http://www.studiovsf.nl/portfolio/portretten/carmen_1.jpg">using text iso image since i have not enough reputations</a><br/>

javascript：

    $(".fancybox")
    .fancybox({
    beforeShow: function () {
        // Add tweet button
        this.title = '<a href="https://twitter.com/share" class="twitter-share-button" data-count="none" data-url="' + this.href + '">Tweet</a> ';

        // Add FaceBook like button
        this.title += '<iframe src="//www.facebook.com/plugins/like.php?href=' + this.href + '&amp;layout=button_count&amp;show_faces=true&amp;width=500&amp;action=like&amp;font&amp;colorscheme=light&amp;height=23" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:110px; height:23px;" allowTransparency="true"></iframe>';
    },
    afterShow: function () {
        // Render tweet button
        twttr.widgets.load();
    },
    helpers: {
        title: {
            type: 'inside'
        }
    }
});

但是当我把这个代码放在我的网页上时，只显示了推特图标，缺少了facebook like按钮。

我似乎无法弄明白为什么。

如果有人能告诉我我做错了什么，我会非常感激。

谢谢，鲁

Answer 1

如果您将网络开发人员网络控制台与工作小提琴和您的网站进行比较，您会注意到以下内容：在小提琴Facebook链接

https://www.facebook.com/plugins/like.php?href=http://www.studiovsf.nl/portfolio/portretten/carmen_1.jpg&layout=button_count&show_faces=true&width=500&action=like&font&colorscheme=light&height=23

但是在你的网站上

https://www.facebook.com/plugins/like.php?href=portfolio/portretten/jardi_betty.jpg&layout=button_count&show_faces=true&width=500&action=like&font&colorscheme=light&height=23

相关部分是href=的值，因为它是您网站上的相对链接。正如Facebook按钮的小提琴中提供的代码是

this.title += '<iframe src="//www.facebook.com/plugins/like.php?href=' + this.href + ....

对于每个锚标记，并且href是绝对的，您可以检查它是否有效，如果您将其调整为

 this.title += '<iframe src="//www.facebook.com/plugins/like.php?href=' 
+ 'http://www.studiovsf.nl/'  + this.href + ....

也许不是问题，但此外，您的网页上有一个脚本错误：

TypeError: jQuery(...).superfish is not a function
jQuery('ul.sf-menu').superfish();

for responsivemen jQuery('ul.sf-menu').superfish();的responsivemenu.js

Facebook喜欢按钮没有显示在fancybox标题

1 个答案: