javascript - 将 css 应用到 Youtube 框架中或修复拇指

Question

我在从 YouTube 嵌入视频时遇到问题，该视频没有向我显示拇指。

我正在尝试覆盖此类位于 YouTube iframe 内的 .ytp-cued-thumbnail-overlay-image 的 CSS。

我尝试使用 jquery，但出现安全错误。有什么可行的解决方案吗？

我正在使用以下jquery，但我不一定拒绝使用jquery，如果需要，我可以采取另一条路径:

jQuery(document).ready(function(){  
    $('iframe.video-force-thumb').on("load",function(){
        $('iframe.video-force-thumb').contents().find('head').append("<style>.my-class2{display:none;} </style>");

    });
});

我在控制台中收到以下错误:

Uncaught DOMException: Failed to read the 'contentDocument' property from 'HTMLIFrameElement': Blocked a frame with origin "http://flowstobay.org" from accessing a cross-origin frame.

有什么解决方案吗？

Answer 1

我使用延迟来显示缩略图的 div，并且来自 YouTube 的缩略图正确加载。

  $(document).ready(function() {
    $('#youTubePlayer').hide();
    setTimeout(function() {
      $("#youTubePlayer").show(400);
    }, 4000);
  });