Добрый вечер, не работает lightbox если он добавляется в блок методом .html();
При нажатии на
сайте на изображения фрукта "Питахайя"
запускается функция
$('#fruit-photos').html('<a href="#" class="w-lightbox w-inline-block fruit-photo"><div class="fruit-photo-hover"><img width="61" src="images/search-icon.png" class="zoom-image">\
</div><img src="images/catalog-09.jpg">\
<script type="application/json" class="w-json">\
{ "group": "питахайя", "items": [{ "url": "images/Tak-rastet-pitahayya.jpg", "fileName": "Tak-rastet-pitahayya.jpg", "origFileName": "Tak-rastet-pitahayya.jpg", "width": 599, "height": 354, "size": 113861, "type": "image" }] }\
</script>\
</a>');
Которая добавляет компонент Lightbox
В итоге, lightbox не работает, как я понял, это из-за того что он подгружается на страницу уже после инициализации самого плагина, подскажите пожалуйста, как правильно запустить инициализацию плагина заново, либо другой вариант решения проблемы.
На сколько я понял за поиск всех lightbox на странице отвечает функция
Webflow.define('lightbox', module.exports = function($, _) {
var api = {};
var lightbox = createLightbox(window, document, $);
var $doc = $(document);
var $body;
var $lightboxes;
var designer;
var inApp = Webflow.env();
var namespace = '.w-lightbox';
var groups;
// -----------------------------------
// Module methods
api.ready = api.design = api.preview = init;
// -----------------------------------
// Private methods
function init() {
designer = inApp && Webflow.env('design');
$body = $(document.body);
// Reset Lightbox
lightbox.destroy();
// Reset groups
groups = {};
// Find all instances on the page
$lightboxes = $doc.find(namespace);
// Instantiate all lighboxes
$lightboxes.webflowLightBox();
}
jQuery.fn.extend({
webflowLightBox: function() {
var $el = this;
$.each($el, function(i, el) {
// Store state in data
var data = $.data(el, namespace);
if (!data) {
data = $.data(el, namespace, {
el: $(el),
mode: 'images',
images: [],
embed: ''
});
}
// Remove old events
data.el.off(namespace);
// Set config from json script tag
configure(data);
// Add events based on mode
if (designer) {
data.el.on('setting' + namespace, configure.bind(null, data));
} else {
data.el
.on('tap' + namespace, tapHandler(data))
// Prevent page scrolling to top when clicking on lightbox triggers.
.on('click' + namespace, function (e) { e.preventDefault(); });
}
});
}
});
а именно строка
// Find all instances on the page
$lightboxes = $doc.find(namespace);
как мне запустить эту функцию? в файле framework.js строка 2133