video-js endcard插件为什么要给播放器添加原生控件？

Question

Endcard 是video-js html5 video player 的插件，可在视频末尾插入链接。 （结束卡信息：https://github.com/theonion/videojs-endcard）。要插入结束卡，您只需要videojs.endcard.js，以及一些用于样式的 css。

但是...问题是，在某些情况下，endcard 会将 videojs 自定义控件从视频中剥离出来，并用本机控件替换它们。例子...

• 经典的 videojs 视频，带有基本的 videojs 样式 - http://www.casedasole.it/video/endcard/index.html
• 相同的视频加上 endcard 演示（在最后）-http://www.casedasole.it/video/endcard/2.html

请注意：

• 看起来它只发生在手机上。在 PC 上，这两个视频在 Chrome、FF 和 IE 中都有样式化的 videojs 控件。

• 这并不总是在手机上发生 - 在 iPad 上的 Safari 和 Opera 中没有问题，但在 iPad 上的 Chrome 中，有时视频 2 具有 videojs 控件，然后在刷新时具有本机控件（发生这种情况时） ，视频通常不会加载）。

• 在 Google Chrome 开发者工具 (PC) 中，视频 2 始终是“原生”的 - 有时看起来不错，但重新加载后却不是。使用开发人员工具，我看到在视频 2 的 html（带有 endcard 的那个）中，css 类“vjs-using-native-controls”（这意味着 videojs 控件的 display:none）被添加到视频中分区。在 Firefox Web 开发人员的生成源中没有添加它。

我已经测试了这两个文件以查看可能导致此问题的原因，并将其归结为 video 2 中 html 末尾的 javascript。如果我删除它，播放器会在 Chrome (iPad) 和 Chrome 开发者工具中恢复其样式控件。

嗯，也许问题出在 Chrome 上？无论如何，有没有人知道冲突发生在哪里，为什么只在手机上，以及如何解决？

Answer 1

这不是插件，而是播放器在第二页初始化的不同方式。播放器选项可以作为第二个参数传递给videojs 函数：

var video = videojs('video', {"nativeControlsForTouch": false} );