1

Webサイトで作業していて、ビデオ出力に問題があります。

//サイトは次のとおりです:http://tastethemovement.org

投稿では、幅560pxのYoutubeビデオを埋め込みました。投稿では見栄えがします。ただし、その画像をプルしてホームページに表示すると、許可されているサイズを超えます。最大316ピクセルにしたいだけです。

クラスであるcssにwidthプロパティをiframeに追加しようとしましたが、機能しません。iframeクラスを設定し、幅が316ピクセルのみを許可すると、投稿のビデオも減少します。

どんな助けでも素晴らしいでしょう!

4

2 に答える 2

0

ホームページ上のこれらの画像が「注目画像の設定」方式からのものである場合は、ビデオのスクリーングラブを実行し、サイズを変更して「注目画像」として使用できます。

于 2013-03-24T14:05:32.110 に答える
0

jsFiddleにこのjQueryコードがあり、iframeをコンテンツの最大サイズに拡張しました。

投稿では、次のHTMLコードを追加します。

<article>
<p><iframe width="400" height="400" src="http://www.youtube.com/...."></iframe></p>
</article>

テンプレートに次のjQueryコードを追加します。

<script type='text/javascript'>
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();

});
});
</script>

Wordpressサイトでコードを試しましたが、機能しました。

于 2013-03-24T14:11:30.610 に答える