0

だから、私は自分のサイトでジリオンのサブライムのHTML5 ビデオ プレーヤーを使用しています。そして、プレーヤーを介して特定のイベントがトリガーされたときに、jQuery を使用してビデオプレーヤーをアニメーション化する方法があるかどうか疑問に思っていましたか?

たとえば、再生ボタンを押すと、ビデオ プレーヤーが画面の中央に移動します。

私はプレーヤーのjsを掘り下げましたが、「再生」、「一時停止」、「終了」、「終了」などを使用して、プレーヤーの動作をトリガーしているようです。私が疑問に思っていたのは、「再生」がヒットしたときにこれを行うと言ういくつかのjQueryと同じテクニックができるかどうかです:

$('#video').animate({left: '350'}, "fast");

私はこれが一種のハックの仕事であることを理解しています.誰かが私にこのようなことをする方法を教えてもらえますか.

play 関数の例を次に示します。

o.play=function(a){if(a||this.ga==Dc)this.Z=0,this.coords=this.ec;else
if(this.Ga())return l;Ic(this);this.startTime=a=oa();-1==this.ga&&(this.startTime-
=this.duration*this.Z);this.ue=this.startTime+this.duration;this.rd=this.startTime;
this.Z||this.vd();this.la("play");-1==this.ga&&this.la("resume");this.ga=1;
var b=ia(this);b in Gc||(Gc[b]=this);Jc();Lc(this,a);return j};

前もって感謝します。

更新: わかりました、これは私が現時点で持っているもので、うまくいくようです.

var v = document.getElementsByTagName("video")[0];
v.addEventListener("playing", function() { 
$('#video').animate({left: '-90'}, "fast");
},function(){
$('#video').animate({left: '-346'}, "fast");
});
4

2 に答える 2

4

HTML5 ビデオには、再生、一時停止、終了など、多数のイベントが発行されます。jQuery の.on()を使用してこれらのイベントにバインドし、そこから必要なことを行うことができます。

于 2012-05-04T02:59:26.823 に答える
0

カスタム イベントを使用して動作をトリガーすることができます。

例えば:

$('body').bind('videoPlay', function() {
   // fancy animation stuff here..
   alert('video started playing');
});

そして o.play 関数内に次のようなものを追加します:

$('body').trigger('videoPlay');

もちろん、JavaScript にアクセスでき、正しい場所で変更できる場合は..

===

別のオプションは、o.play を独自のメソッドで上書きしてから、元の o.play. を呼び出すことです。これが機能するかどうかはわかりませんが、例の o.play() メソッドが pause() と遊ぶ()?このようなもの:

var oldplay = o.play;
o.play = function() {
  $('body').trigger('videoPlay');
  return oldplay.call();
}

いずれにせよ、イベントを「トリガー」する必要がある場所がわかっている限り、カスタム イベントにバインドして対応することができます。

于 2012-05-04T03:01:36.430 に答える