是否可以使用自己的player.js库在Vimeo iframe上使用自定义光标？

Question

我为我们的设计工作室建立了一个网站，其中包含嵌入了Vimeo的Player.js库的Vimeo视频。我们有一个大的自定义光标，可以在整个网站上使用，但显然光标不能用于iframe。

我使用了一种解决方法来循环播放视频（不需要任何用户交互），在播放器上放置一个不可见的伪元素，从而使它仍被视为我的域。

.video__loop::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 1;
}

此页面包含不需要控件的背景循环视频示例，因此自定义光标没有问题：https://www.new.company/work/two-chairs

但是，我还创建了一个带有时间码和播放/暂停的自定义播放器，需要用户交互，因此光标技巧不起作用，因为我需要人们能够单击Vimeo对象。

这个页面有我制作的基本视频播放器的例子：https://www.new.company/work/nike-chantel-navarro

是否可以通过一个对象传递到另一个对象？或者是否可以将点击指向Vimeo对象？

根据文档，我应该可以使用播放方法，只要它不在移动设备上（我不需要担心，因为我的光标问题不是问题），但我无法得到它工作。目前我依靠直接互动来启动视频。

https://github.com/vimeo/player.js/

play(): Promise<void, (PasswordError|PrivacyError|Error)>
Play the video if it’s paused. Note: on iOS and some other mobile
devices, you cannot programmatically trigger play. Once the viewer
has tapped on the play button in the player, however, you will be
able to use this function.

Answer 1

尝试plyr.io播放器，它播放Vimeo和Youtube视频，你可以使用自己的CSS。我试图将你的css添加到他们的demo页面，它工作正常：

html, body, iframe, a, * {
  cursor: url(https://www.new.company/img/new_cursor.svg) 10 10, pointer;
  cursor: -webkit-image-set(url(https://www.new.company/img/new_cursor.svg) 1x, url(https://www.new.company/img/[email protected]) 2x) 0 0, pointer;
}

它不适用于视频广告，Vimeo和Youtube不会发生这种情况，因为您无法播放视频广告及其视频，只有您可以使用自己的托管视频播放视频广告。