0

私のウェブページの動画にスクイーズバックを追加することに興味があります。

ビデオ自体の中に実装せずにこれを行う簡単な方法はありますか?

4

3 に答える 3

1

ID付きのdiv内にビデオを配置します。jqueryを使用して、ビデオ要素のサイズを変更します(おそらく%sを使用)。ビデオ要素の後に要素をdivに追加します(.appendElement())別のもので埋めます。

于 2012-05-24T14:25:35.627 に答える
1

それは絶対divと重複します:

<div id="container">
    <div id="background">contents here</div>
    <div id="videoWrapper">
        <video></video>
    </div>
</div>

#container{
    position:relative;
}

#container > *{
    position:absolute; /*to allow stacking*/
    top: 0;            /*stretch to container*/
    bottom:0;
    left: 0;
    right: 0
}

次に、ビデオを拡大縮小するには、要素の「拡大縮小」に関するこの投稿を見て、アスペクト比を維持します。

于 2012-05-24T14:26:43.407 に答える
1

<video>は他の要素と同様に HTML 要素であるため、CSS と JavaScript を使用してサイズを変更したり、他の要素を周囲や上に配置したりできます。

おそらく、相対的に配置された div 内にビデオを配置します。適切なタイミングで、少しスクリプトを使用してビデオを適切にスケーリングし、その上/下/横に完全に配置された要素を追加します。世界はあなたのカキです。試してみて、また報告してください!

考えてみれば、Mozilla のPopcorn.jsは、このような場合に役立つかもしれません。

于 2012-05-24T14:26:14.107 に答える