Chuyển đến nội dung chính

Bài đăng

Hiển thị các bài đăng có nhãn HTML

[HTML] Phát hiện audio/ MP3 phát kết thúc và tự động thực thi 1 nhiệm vụ

Đoạn mã dưới đây dùng để phát hiện 1 bài hát hay 1 tệp tin mp3/ audio phát kết thúc và trình duyệt sẽ tự động thực thị một mệnh lệnh do bạn cài đặt trước như tự động tải trang kế tiếp, tự động thông báo âm thanh phát kết thúc,... <audio id="audio" autoplay controls> <source src="URL.mp3" type="audio/mpeg"> </audio> <div> <b>Kế tiếp: "Đường xưa lối cũ" trong <span id="timer">...</span> giây</b> </div> <script> var audio = document.getElementById("audio"); audio.onended = function() { setTimeout(function(){ window.location.href = ['http://kimluc.blogspot.com/2015/12/uong-xua-loi-cu-thanh-tuyen.html']}, 10000); var hou = 0; var sec = 10; setInterval(function(){ var a = new Date(); document.getElementById("timer").innerHTML = hou +" : " + sec ; sec--; if(sec == 00) { hou--; ...

[HTML5] Tạo danh sách phát (playlist) MP3 hoặc video tự động phát ngẫu nhiên

Giả sử bạn có 9 bài hát (mp3 hoặc video/mp4) là bài 1, bài 2, bài 3,..., bài 9 và bạn muốn phát các bài hát này một cách ngẫu nhiên không theo thứ tự mỗi khi người xem truy cập vào trang blog/ web của bạn giống như Zing radio, Nhưng Zing radio viết bằng Flash (bị hạn chế ở nhiều thiết bị chạy Android, iOS), ở đây mình viết bằng HTML5 (hỗ trợ hầu hết thiết bị chạy Windows, Android, iOS,...). Các đoạn mã sau đây sẽ giúp bạn thực hiện điều đó. Xem minh họa: http://jsfiddle.net/fe7JL/192 <!DOCTYPE html> <html> <head> <!--Shuffle--> <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script> <!--Đường dẫn file javascript trên có thể thay thế bằng: https://ia601500.us.archive.org/20/items/audio-shuffle-jquery-1.7.2-jquery.min/audio-shuffle-jquery-1.7.2-jquery.min.js --> <script type='text/javascript'>//<![CDATA[ $(window).load(function(){ for (var $...

[HTML] Tự động thực thi một nhiệm vụ sau khi video kết thúc - Phát hiện video phát kết thúc

Trang blog/ web của bạn chuyên về video và bạn muốn khi người xem xem xong một video clip trên một trang blog/ web thì trình duyệt sẽ tự động thực hiện một nhiệm vụ nào đó ví dụ như tự động tải trang có video tiếp theo. Bạn có thể tham khảo cách sau: Xem minh họa: --> http://kimluc.blogspot.com/2017/04/em-tan-ben-ngu-ngoc-ha.html <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://kimluc.blogspot.com/2017/04/em-tan-ben-ngu-ngoc-ha.html']; }; </script> Hiện thời gian báo trước khi tải trang video kế tiếp: <video autoplay id="myVideo" controls width="630" height="380"> <source src="https://archive.org/download/Dentanbenngu_ngocha/%C4%90%C3%AAm%20t%C3%A0n%20b%E1%BA%B...

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...