当我单击图像并单击 Twitter 或 Facebook 共享按钮时,它会共享带有照片链接的页面标题。有什么办法可以在其中插入图像的标题吗? Fancybox 获取图像的 title
属性(即“第一个标题”、“第二个标题”),但我不知道如何将其放入实际的推文中。我在 Fancybox docs 中找不到任何相关信息。 .
fiddle :http://jsfiddle.net/G5TC3
HTML
<a title="1st title" class="fancybox" href="http://fancyapps.com/fancybox/demo/1_b.jpg"><img src="http://fancyapps.com/fancybox/demo/1_s.jpg" alt=""/></a>
<a title="2nd title" class="fancybox" href="http://fancyapps.com/fancybox/demo/2_b.jpg"><img src="http://fancyapps.com/fancybox/demo/2_s.jpg" alt=""/></a>
JS
$(".fancybox")
.attr('rel', 'gallery')
.fancybox({
beforeShow: function () {
if (this.title) {
// New line
this.title += '<br />';
// 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 + '&layout=button_count&show_faces=true&width=500&action=like&font&colorscheme=light&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'
}
}
});
最佳答案
这就是答案的一半。
对于 Twitter,您可能需要在添加任何社交媒体按钮之前在变量中捕获原始标题
。然后使用 twitter 的 data-text
属性来设置该值,例如:
beforeShow: function () {
if (this.title) {
var _title = this.title; // capture original title
// New line
this.title += '<br />';
// Add tweet button WITH data-text parameter
this.title += '<a href="https://twitter.com/share" class="twitter-share-button" data-count="none" data-text="' + _title + '" data-url="' + this.href + '">Tweet</a> ';
// Add FaceBook like button
this.title += '{facebook iframe}';
}
},
参见JSFIDDLE
注意:我不确定 Facebook 是否允许您传递该信息(这将是答案的另一半)
关于javascript - 在 Fancybox 的 Twitter 'tweet' 或 Facebook 'like' 中插入标题?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26273949/