ギャラリーを初期化するときに各画像にキャプションを設定することはできますか？

Question

magnific popupを使用すると、javascriptを使用してギャラリーを初期化するときに各画像にキャプションを設定できますか？各画像にDOM要素がないので、キャプションへのポインタとしてtitle属性（または他の属性）を使用することはできません。

$('#my-gallery').magnificPopup({ 
    items: [ 
     { 
      src: 'image.jpg', 
      title: 'Some Title' 
     }, 
     { 
      src: 'image2.jpg', 
      title: 'Some Other Title' 
     } 
    ], 
    gallery: { 
     enabled: true 
    }, 
    type: 'image' 
}); 

Answer 1

あなたはmagnificポップアップのドキュメント（http://dimsemenov.com/plugins/magnific-popup/documentation.html#image-type）ごとに、あなたの画像にキャプションを追加するには、次のパラメータを渡すことができます。ここでは

$('#my-gallery').magnificPopup({ 
    items: [ 
     { 
      src: 'image.jpg', 
      title: 'Some Title' 
     }, 
     { 
      src: 'image2.jpg', 
      title: 'Some Other Title' 
     } 
    ], 
    gallery: { 
     enabled: true 
    }, 
    type: 'image', 
    image: { 
     markup: '<div class="mfp-figure">'+ 
      '<div class="mfp-close"></div>'+ 
      '<div class="mfp-img"></div>'+ 
      '<div class="mfp-bottom-bar">'+ 
       '<div class="mfp-title"></div>'+ 
       '<div class="mfp-counter"></div>'+ 
      '</div>'+ 
      '</div>', // Popup HTML markup. `.mfp-img` div will be replaced with img tag, `.mfp-close` by close button 

     tError: '<a href="%url%">The image</a> could not be loaded.' // Error message 
    } 
}); 

は作業jsfiddleです： https://jsfiddle.net/wmboxLfr/3/

注意をここでの重要なことは、イメージマークアップに 'mfp-title'があり、アイテムがパラメータとしてtitleを渡すことです。乾杯！