Galleria видео не показывает значок видео в мобильном телефоне - PullRequest
Новая
       42

Galleria видео не показывает значок видео в мобильном телефоне

0 голосов
/ 28 июня 2018

На моем коммерческом веб-сайте drupal мы используем Galleria для слайд-шоу продуктов. В соответствии с недавним требованием нам нужно было добавить видео (youtube) в качестве второго элемента в слайд-шоу . Я достиг этого, используя splice function, как упоминалось здесь : 

(function($){
  Galleria.ready(function(options) {  

    var gallery = this;
    gallery.splice(1, 0, { video: 'https://www.youtube.com/watch?v=1wNzzCWWEdg' });
      });

})(jQuery);

Как показано ниже, это отлично работает в ноутбуке / настольном компьютере .

enter image description here

В мобильных телефонах видео добавляется правильно на второй позиции, , но имеет две проблемы.

  1. Значок видео в центре изображения отсутствует .

  2. Пользователь должен дважды щелкнуть, чтобы воспроизвести видео. При нажатии сначала загружает актуальное видео YouTube , а затем пользователь должен нажать еще раз, чтобы воспроизвести видео.

Что я проверил до сих пор, чтобы решить эту проблему:

а. Через «Инспектировать элемент» я обнаружил, что этот элемент добавляется в DOM на рабочем столе , но не в DOM на мобильном . 

<div class="galleria-videoicon">
  <i></i>
</div>

б. В консоли отображается следующая ошибка (TypeError: img is undefined) для мобильных устройств.

enter image description here

Я попытался просмотреть файл galleria.js в строке 3069, как показано в ошибке. Я не мог понять здесь много.

enter image description here

Как мне сделать следующий шаг, чтобы решить это? Любые советы / рекомендации высоко ценится. Заранее спасибо.

Обновление:

Я также попытался добавить Значок видео в элементы галереи для мобильных устройств. 

   //For Mobile Devices
    Galleria.on('image', function(e) {
          $(e.imageTarget).after("DOM_FOR_ICON");            
    });

Но это (или любой другой код JS) не работает для первых двух элементов в Галерее. Работает только на третьем и последующих элементах.

1 Ответ

0 голосов
/ 28 июня 2018

Исходя из того, что вы показали, мне кажется, что код в строке 3062 делает тихий сбой до undefined

В строке 3064, попробуйте добавить следующие строки: 

console.log(img);
console.log(self);
console.log(self._controls);
console.log(self._controls.slides);
console.log(self._controls.slides[loadme])

Или, если у вас есть отладчик в вашем редакторе / IDE, было бы лучше добавить точку останова отладки в строке 3064 вместо

Что это дает вам в консоли? Если вы получите что-нибудь undefined здесь, это может быть виновником. Вы можете вернуться назад вверх по стеку, чтобы с большей точностью определить его дальше ...

...