videoObject.currentTimeは、埋め込み動画(video要素)の再生位置を取得、もしくは、設定するプロパティ。
構文
取得
var $currentTime = $videoElementReference.currentTime;
戻り値
現在の再生時間。ドキュメントに埋め込んだ動画ファイルの現在の再生位置を示す秒単位の数値。
設定
$videoElementReference.currentTime = 再生位置;
- 再生位置
- 再生位置を秒単位の数値で指定。
サンプル
再生開始位置移動:
再生開始位置:0
サンプルの動作について
2014/02/01現在、Chromeでのみ動作確認。
- 「再生開始位置移動:」の右側のレンジ入力欄で、再生を始める位置を調整できる。
- 「再生開始位置:」の右側に、指定したを再生開始位置を示す秒単位の数値を表示する。
サンプルのソースコード
JavaScript
<script type="text/javascript">
window.onload = function(){
setCurrentTime( 0 );
document.getElementById( "sampleCurrentTime" ).value = 0;
}
function setCurrentTime( $currentTime ) {
var $elementReference = document.getElementById( "sample" );
$elementReference.currentTime = $currentTime;
document.getElementById( "sampleOutputCurrentTime" ).innerHTML = $currentTime;
}
</script>
window.onload = function(){
setCurrentTime( 0 );
document.getElementById( "sampleCurrentTime" ).value = 0;
}
function setCurrentTime( $currentTime ) {
var $elementReference = document.getElementById( "sample" );
$elementReference.currentTime = $currentTime;
document.getElementById( "sampleOutputCurrentTime" ).innerHTML = $currentTime;
}
</script>
HTML
<p>
再生開始位置移動:
<input type="range" value="0" id="sampleCurrentTime" min="0" max="15" step="1" onchange="setCurrentTime(this.value)">
</p>
<p>再生開始位置:<span id="sampleOutputCurrentTime">0</span></p>
<video src="http://alphasis.info/wp-content/uploads/2014/01/javascript-dom-video-sample.mp4" id="sample" controls>
<p>お使いのブラウザはvideo要素に対応していません。</p>
</video>
再生開始位置移動:
<input type="range" value="0" id="sampleCurrentTime" min="0" max="15" step="1" onchange="setCurrentTime(this.value)">
</p>
<p>再生開始位置:<span id="sampleOutputCurrentTime">0</span></p>
<video src="http://alphasis.info/wp-content/uploads/2014/01/javascript-dom-video-sample.mp4" id="sample" controls>
<p>お使いのブラウザはvideo要素に対応していません。</p>
</video>