我正在使用 Fancybox 1.3.4 ,我希望能够在标题中为当前正在查看的图像添加下载链接。如何在不切换到 Fancybox 2.0 的情况下执行此操作,因为这不适合我的情况。
这是我的尝试:
_format_title = function(title) {
var $el = $('.thumb-link');
var url = $el.attr('href');
var dl = $el.data('dl');
var link = ' <a class="download-link" href="' + url + '" download="' + dl + '">Download</a>';
if (title && title.length) {
if (currentOpts.titlePosition == 'float') {
return '<table id="lightbox-title-float-wrap" cellpadding="0" cellspacing="0"><tr><td id="lightbox-title-float-left"></td><td id="lightbox-title-float-main">' + title + '</td><td id="lightbox-title-float-right"></td></tr></table>';
}
return '<div id="lightbox-title-' + currentOpts.titlePosition + '">' + title + link + '</div>';
}
return false;
},
我创建了这些变量,然后添加了+title+link+
,但它不会获得当前查看的标题,它将获得第一个锚点href
。变量dl
的数据来自html
中包含图像文件名的数据属性。
答案 0 :(得分:0)
好吧,无论如何我最终还是把它弄清楚了。我认为id会发布答案,以防万一其他人遇到同样的问题。我使用了fancybox 1.3.4必须修复的已经定义的变量和函数。
以下是完成的代码:
_format_title = function(title) {
downloadLink = ' <a class="download-link" href="' + currentOpts.href + '" download="' + currentOpts.href + '">Download</a>';
if (title && title.length) {
if (currentOpts.titlePosition == 'float') {
return '<table id="lightbox-title-float-wrap" cellpadding="0" cellspacing="0"><tr><td id="lightbox-title-float-left"></td><td id="lightbox-title-float-main">' + title + '</td><td id="lightbox-title-float-right"></td></tr></table>';
}
return '<div id="lightbox-title-' + currentOpts.titlePosition + '">' + title + downloadLink + '</div>';
}
return false;
},
创建了一个新变量:
downloadLink = ' <a class="download-link" href="' + currentOpts.href + '" download="' + currentOpts.href + '">Download</a>';
然后我将新变量添加到title:
return '<div id="lightbox-title-' + currentOpts.titlePosition + '">' + title + downloadLink + '</div>';