Масонство ImagesLoaded HTML5 Видео-плакат

Question

Я использую masonry.js вместе с плагином imagesloaded.pkgd.js. Сценарий ImagesLoaded должен обнаруживать, когда браузер завершил загрузку изображений перед инициализацией кладки.

Хотя это работает с изображениями в тегах img, оно не работает с HTML5 Video's poster tag.

Есть ли способ получить ImagesLoaded, чтобы играть хорошо с атрибутом Video Poster HTML5?

Answer 1

Я поднял вопрос на git repo imagesLoaded. По словам автора, библиотека не поддерживает загрузку видео постеры HTML5, но она была зарегистрирована как запрос функции.

https://github.com/desandro/imagesloaded/issues/197

я решил использовать jQuery's Load метод, который имеет функцию обратного вызова, который срабатывает после того как элемент загружен. Поскольку я хотел запустить один обратный вызов после загрузки всех изображений, я просто включил счетчик.

var posterCount = $('video').length; 
var postersLoaded = 0; 

$('video').load(function() { 

    postersLoaded++; 

    if (postersLoaded >= posterCount) { 


     $('#contentList').masonry({ 
      itemSelector: '.csContent' 
     }); 

     $('#contentList').masonry('reloadItems'); 
     $('#contentList').masonry('layout'); 

    } 

});