Как загрузить содержимое заголовка Fancybox с помощью Ajax? - PullRequest
0 голосов
/ 26 апреля 2018

Я хочу показать некоторую информацию в виде HTML в заголовке Fancybox.

Эта информация загружается рядом с изображением в виде HTML-элемента с помощью ajax.

До сих пор у меня был метод постзагрузки, который загружал содержимое заголовка из этого HTML-элемента в заголовок, отсоединив его и добавив в заголовок после загрузки ajax.

afterLoad : function (instance, slide) {
                 $( ".fancybox-slide--current .caption-content" ).detach()
                 .appendTo( ".fancybox-caption" );
            }

Это обходной путь, который я использовал, есть ли более чистый способ сделать это?

1 Ответ

0 голосов
/ 26 апреля 2018

Я не уверен, что понимаю вас, но думаю, вы ищете способ правильно обновить заголовок. Вот демо, вы можете настроить его для использования ajax:

$('[data-fancybox="images"]').fancybox({

  afterLoad: function(instance, current) {

    if (instance.group[ current.index ].isProcessed !== true ) {

      setTimeout(function() {
        if ( !instance.isClosing ) {
          var caption = 'Another caption for #' + (current.index + 1);

          // Set caption permanently for current group item
          instance.group[ current.index ].opts.caption = caption;

          // Set caption for current slide object
          current.opts.caption = caption;

          // Update caption HTML element
          instance.updateControls();

          // Do this only once
          instance.group[ current.index ].isProcessed = true;
        }

      }, 3000);
    }
  }
});

https://codepen.io/anon/pen/RyGZZE?editors=1010

...