Thứ Hai, 14 tháng 12, 2015

HTML: Tự động thực thi một chức năng sau khi video kết thúc

Đoạn mã dưới đây sẽ ra lệnh cho trình duyệt tự động thực thi một nhiệm vụ, như tự tải một trang video mới, sau khi video trên trang hiện tại phát xong.

Thủ thuật gồn 2 tính năng: Tự động thực thi ngay khi video kết thúc và hẹn thời gian thực thi sau khi video kết thúc.

1. Tự tải trang tiếp theo ngay khi video kết thúc:

Xem minh họa: http://jsfiddle.net/fnrtqqsv/2/

Mã/ Code:

<video id="myVideo" controls>
<source src="http://grochtdreis.de/fuer-jsfiddle/video/sintel_trailer-480.mp4" type="video/mp4" />
</video>

<script>
var aud = document.getElementById("myVideo");
aud.onended = function() {
window.location.href = ['http://timvn.blogspot.com/2015/04/thanh-pho-ngan-cay.html'];
};
</script>

Trong đó: http://timvn.blogspot.com/2015/04/thanh-pho-ngan-cay.html là đường dẫn (URL) của trang sẽ tự động tải tiếp theo sau khi video ở trang hiện tại phát xong.

2. Hẹn thời gian tải trang tiếp theo.

Xem minh họa: http://jsfiddle.net/fnrtqqsv/5/

Mã/ Code:

<video autoplay id="myVideo" controls>
<source src="http://grochtdreis.de/fuer-jsfiddle/video/sintel_trailer-480.mp4" type="video/mp4" />
</video>
<div>
<b>Tự động tải video kế tiếp trong <span id="timer">…</span> phút</b>
</div>
<script>
var aud = document.getElementById("myVideo");
aud.onended = function() {
setTimeout(function(){ window.location.href = ['http://timvn.blogspot.com/2015/04/thanh-pho-ngan-cay.html']}, 16000);
var hou = 0;
var sec = 15;
setInterval(function(){
var a = new Date();
document.getElementById(“timer”).innerHTML = hou +" : " + sec ;
sec–;
if(sec == 00)
{
hou–;
sec = 15;
if (hou == 0)
{
hou = 0;
}
}
},1000);
}

function resetTimer()
{
};
</script>

Không có nhận xét nào:

Đăng nhận xét