我正在寻找一种在div
(.image-caption
)中显示img
标题和alt
标签的方法。
这是我到目前为止的代码:
owl.on('changed.owl.carousel', function(event) {
var comment = $(this).find('img').attr('alt');
var title = $(this).find('img').attr('title');
if(comment) $('#desktop .image-caption').html('<h4>'+title+'</h4><p>'+comment+'</p>');
})
有什么想法吗?谢谢!
您可以使用translated.owl.carousel
事件
这是一个工作小提琴
owl.on('translated.owl.carousel', function(event) {
var comment = $(this).find('.active').find('img').attr('alt');
var title = $(this).find('.active').find('img').attr('title');
if(comment) $('.image-caption').html('<h4>'+title+'</h4><p>'+comment+'</p>');
});
更新:
略微改进了代码,并添加了在轮播加载时更新图像标题的功能。
小提琴
这
有效:
var comment = $(this).find('.active').find('img').attr('alt');
var title = $(this).find('.active').find('img').attr('title');
if(comment) $('.image-caption').html('<h4>'+title+'</h4><p>'+comment+'</p>');
试试看:https://jsfiddle.net/wx0ovpzh/49/