iframe调整脚本在localhost上工作但不在Wordpress上工作

时间:2013-03-20 03:51:21

标签: javascript wordpress

我有一个脚本(感谢css-tricks.com)根据屏幕大小调整YouTube iframe的大小。它适用于localhost但不适用于WordPress。如果我将$fluidE1变量的选择器更改为= $('article')之类的内容,它可以在WP上工作。

为什么它不适用于'p'变量?新的WordPress YouTube嵌入在

标签中包含所有内容,因此,如果我能够将其运行起来,那将节省大量时间。

HTML

<article>
<p><iframe width="500" height="375" src="http://www.youtube.com/embed/wcbrtWjmArA?feature=oembed" frameborder="0" allowfullscreen></iframe></p>
</article>

脚本

jQuery(document).ready(function($) {
$(function() {

var $allVideos = $("iframe[src^='http://player.vimeo.com'], iframe[src^='http://www.youtube.com'], object, embed"),
$fluidEl = $("p");

$allVideos.each(function() {

  $(this)
    // jQuery .data does not work on object/embed elements
    .attr('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.attr('data-aspectRatio'));

  });

}).resize();

});
});

0 个答案:

没有答案