html - ビデオでクリップパスが機能しない

Question

私は画像を表示しようとしていましたが、ホバーすると、ビデオが画像を置き換え始めました。ホバー機能にJavascriptを使用しました。

私はこのようにビデオタグで「ポスター」を使用してこれを行いました:`

<div class="video">

    <video id="videotest" poster="images/img.jpg">
        <source src="images/bkg.mp4" type="video/mp4"></source>
        Can't use videos here.
    </video>

</div>

ただし、ビデオを画像と同じサイズにしたいと思います。ビデオは 1280*720、画像は 677-611 です。ビデオを適応させるためにクリップパスを使用しようとしましたが、うまくいきません。これが私の CSS です:

.video {
    text-align:center;
    margin:0 auto;
    height:auto;
    clip-path:inset(0 978px 611px 301px);
    -webkit-clip-path:inset(0 978px 611px 301px);
}

このスタイルを .video、#videotest、およびソースに適用しようとしましたが、それでも期待どおりに動作しませんでした。

HTML5 の動画でクリップパスを使用することはできませんか? もしそうなら、どうすればそれを行うことができますか?そうでない場合、どうすればそれを機能させることができますか?

私はもう少し自分自身を説明します：画像のサイズを変更したくない、プロポーションを維持するかどうか、たとえば、左右のピクセルを切り取りたいだけなので、ポスターの画像はまったく同じサイズになりますそれを置き換えるビデオとして。Clip-path は私が探していたものに対応しているように見えましたが、動作させることができません。

ありがとう。