NyroModal: расположение заголовков изображений внизу

Question

Я использую отличный NyroModal для создания фотогалереи. Однако я изо всех сил стараюсь расположить заголовки фотографий под изображениями, а не над ними (по умолчанию, NyroModal). Кто-нибудь достиг их расположения ниже?

Answer 1

Если вы используете обратный вызов beforeShowCont, ваша позиция заголовка снова изменится после изменения размера окна браузера. При использовании обратного вызова afterReposition позиционирование заголовка также будет работать после изменения размера окна браузера. Вам также необходимо найти абсолютную позицию изображения, используя $('.nyroModalImage img').offset(), Для этого примера смещение между изображением и заголовком выбрано 10(px).

<script type="text/javascript">
jQuery(function($) {
  $(".nyroModal").nm({
    callbacks: {
      afterReposition: function(nm) {
        if (nm._hasFilter('title')) {
          var pos = $('.nyroModalImage img').offset();
          $('h1.nyroModalTitle').css('top', pos.top+$('.nyroModalImage img').height()+10);
        }
      }
    }
  });
});
</script>

Answer 2

Вы должны изменить положение тега заголовка (h1через обратный вызов:

<script type="text/javascript">
jQuery(function($) {
    $('.nyroModal').nm({
        callbacks: {
            beforeShowCont: function(nm) {
                if (nm._hasFilter('title')) {
                    $('h1.nyroModalTitle').css('top', $('.nyroModalImage img').height()+5);
                }
            }
        }
    });
});
</script>

Очевидно, вы измените смещение в соответствии с вашими потребностями.