複数のキャプションとフェザーライト？

Question

私は、イメージギャラリーのためにfeatherlight.jsを使用してキャプションのため、このコードを使用しています：

$.featherlightGallery.prototype.afterContent = function() { 
    var caption = this.$currentTarget.find('img').attr('alt'); 
    this.$instance.find('.caption').remove(); 
    $('<div class="caption">').text(caption).appendTo(this.$instance.find('.featherlight-content')); 
}; 

今クライアントは、ギャラリーの画像の右側にのみ著作権情報を含む第2のキャプションを追加したいです。 .captionという名前のキャプションと.copyrightのキャプチャの2つのキャプションを持つことは可能ですか？

"data-caption ="と上記のjs-initialの単純なコピーを試しましたが、失敗しました。

メリークリスマス前もっておねがいします！

Answer 1

データ属性を使用できます。

$.featherlightGallery.prototype.afterContent = function() { 
    var caption = this.$currentTarget.find('img').attr('alt'); 
    this.$instance.find('.caption').remove(); 
    $('<div class="caption">').text(caption).appendTo(this.$instance.find('.featherlight-content')); 

    var copyright = this.$currentTarget.find('img').data('copyright'); 
    this.$instance.find('.copyright').remove(); 
    $('<div class="copyright">').text(copyright).appendTo(this.$instance.find('.featherlight-content')); 
}; 

は、その後、あなたのマークアップで

<img src="..." alt="my caption text" data-copyright="my copyright text"> 

とあなたのCSSで

.copyright { 
    float: right; 
} 

または合うように何かを追加。

条件付きである必要がある場合は、data-copyright属性の定義済みおよび/または長さを確認できます。