Дополнительный заголовок div на Fotorama slider

Question

Возможно ли добавить второй блок надписей?

Нам нравится div anoter, разрешающий тексты с стилями css под основными надписями. Как мы можем добавить это новое поле в .js? Css-стиль прост, но мы не знаем, как добавить это новое поле.

Answer 1

Этот код делает то же самое, может быть, это вам поможет.

<!-- 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> 

код расслоение плотной

$('.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" для этого: http://fotorama.io/customize/html/#selectable-text

Таким образом, вы могли бы положить что-нибудь в слайде.