Galleria视频未在移动设备中显示视频图标

Question

在我的drupal Commerce网站上，我们使用Galleria进行产品幻灯片放映。 根据最近的要求，我们需要将一个（youtube）视频添加为幻灯片放映中的第二项。 我通过使用here中提到的splice function实现了这一目标：

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

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

})(jQuery);

如下所示，在笔记本电脑/台式机中，该功能完全正常。

在手机中，视频已正确添加到第二位置，但有两个问题。

1. 图像中心的视频图标丢失。

2. 用户必须单击两次才能播放视频。单击时，首先     加载实际的youtube视频，然后用户必须再次单击以     播放视频。

到目前为止我为解决此问题所做的检查：

a。通过“检查元素”，我发现此元素已添加到桌面的DOM中，但未添加到移动设备的中。

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

b。在控制台中，针对移动设备显示以下错误（TypeError: img is undefined）。

我尝试在行号3069处查看galleria.js文件，如错误所示。我在这里不太清楚。

如何采取下一步措施解决该问题？ 任何提示/指导，不胜感激。 预先感谢。

更新：

我还尝试了将视频图标添加到移动设备的图库元素中。

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

但是，此（或任何其他JS代码）不适用于Gallery上的前两个元素。它仅适用于第三个元素。

Answer 1

根据您显示的内容，在我看来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的任何东西，那可能是罪魁祸首。您可以从那里向后向上堆栈，以更精确地进一步定位它...