javascript - youtube 视频没有响应

Question

我应用了以下 js 来使 youtube 视频变得响应式。视频放在 iframe 中这是脚本-:

var $allVideos = $("iframe[src^='//player.vimeo.com'], iframe[src^='//www.youtube.com']"),

    $fluidEl = $(".newsblock_maintext");

$allVideos.each(function() {

  $(this)
    .data('aspectRatio', this.height / this.width)

    .removeAttr('height')
    .removeAttr('width');

});

$(window).resize(function() {

  var newWidth = $fluidEl.width();

  $allVideos.each(function() {

    var $el = $(this);
    $el
      .width(newWidth)
      .height(newWidth * $el.data('aspectRatio'));

  });

}).resize();

下面是我的 YouTube 视频，它位于“newsblock_maintext”div 中。

<div class="newsblock_maintext"><p>Bekijk hier de nieuwe kijk op het wonen volgens MisuraEmme: "The way you are furniture for 24H life-style" zoals onlangs gepresenteerd is, tijdens de succesvolle Salone del Mobile 2015.</p><p><iframe width="560" height="315" frameborder="0" src="https://www.youtube.com/embed/8Ei0jelpeGQ"></iframe></p></div>

那么我需要什么才能使该视频具有响应性。

Answer 1

iframe 选择器返回 null。您在选择器中缺少 https。

$("iframe[src^='//player.vimeo.com'], iframe[src^='//www.youtube.com']")

改变

var $allVideos = $("iframe[src^='//player.vimeo.com'], iframe[src^='//www.youtube.com']")

到

var $allVideos = $("iframe")

或

var $allVideos = $("iframe[src^='//player.vimeo.com'], iframe[src^='https://www.youtube.com']")

工作 fiddle :

Fiddle