Мне нужно привязать лайтбокс Featherlight ко всем <a>
элементам определенного класса (например, vimeo-element
.)
(я пытался добавить атрибут featherlight-data
с помощью js, но это ненадежно.)
Есть ли способ сделать это с помощью Featherlight?
Я не могу изменить ни один из включенных HTML, потому что он генерируется плагином.
Полный *Тег 1012 * выглядит следующим образом:
<a class="vimeo-element" href="https://player.vimeo.com/video/285304289?autoplay=1">VimeoVideo</a>
, и я хочу, чтобы Featherlight открыл href
как iframe
.
PS Я видел этогде-то:
$("a.vimeo-element").featherlight();
Это все, что мне нужно сделать?
PPS Это сработало!
Однако ... плагингенерация HTML - это "Essential Grid", и в нем есть ленивая функция "load more".Лайтбокс открывается только для загруженных элементов ДО того, как произойдет загрузка.Как я могу это исправить?
Что у меня есть:
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script src="https://cdn.rawgit.com/noelboss/featherlight/1.7.13/release/featherlight.min.js" type="text/javascript" charset="utf-8"></script>
<script>
jQuery(document).ready(function($){
$.extend($.featherlight.defaults, {
type: "iframe",
iframeFrameborder: "0",
iframeAllow: "autoplay; encrypted-media",
iframeAllowfullscreen: "true",
iframeStyle: "position:fixed;background:#000;border:none;top:0;right:0;bottom:0;left:0;width:100%;height:100%;"
});
});
$("a.vimeo3-element").featherlight();
</script>
Кажется, что Featherlight не "ловит" a
, которые загружаются после прокрутки вниз.