Fotorama 슬라이더의 추가 캡션 div

Question

두 번째 캡션 블록을 추가 할 수 있습니까?

우리는 principal 제목 아래 CSS 스타일을 가진 텍스트를 허용하는 anoter div를 좋아합니다. 이 새로운 필드를 .js에 어떻게 추가 할 수 있습니까? CSS 스타일링은 쉽지만이 새로운 필드를 추가하는 방법을 알지 못합니다.

Answer 1

동일한 코드를 사용하면이 코드가 도움이 될 수 있습니다. 슬라이드 내부에 아무것도 넣을 수 http://fotorama.io/customize/html/#selectable-text

이 방법 :

<!-- Just don’t want to repeat this prefix in every img[src] --> 
<base href="http://fotorama.s3.amazonaws.com/i/nyc/"> 

<!-- Fotorama --> 
<div class="fotorama" data-width="100%" data-ratio="500/333" data-fit="cover" data-nav="false" data-auto="false"> 
    <img src="http://fotorama.s3.amazonaws.com/i/nyc/streetlook.jpg" data-author="Alexei Lebedev" data-title="Streetlook" /> 
    <img src="http://fotorama.s3.amazonaws.com/i/okonechnikov/1-lo.jpg" data-author="Andrey Okonechnikov" data-title="Alpen Fog" /> 
</div> 

<p class="fotorama-caption"></p> 

JS 코드

$('.fotorama') 
    .on('fotorama:show', function (e, fotorama) {  
    fotorama.$caption = fotorama.$caption || $(this).next('.fotorama-caption'); 
    var activeFrame = fotorama.activeFrame; 
    fotorama.$caption.html(
     '<strong>' + activeFrame.title + '</strong><br>' 
     + activeFrame.author 
    ); 
    }) 
    .fotorama(); 

demo jsffidle

Answer 2

나는 그것에 대해 "사용자 정의 HTML"블록을 사용하는 것이 좋습니다 것입니다.