HTML အသံ/ဗီဒီယို DOM အချိန်မွမ်းမံမှု အစီအစဉ်
❮ HTML အသံ/ဗီဒီယို DOM ရည်ညွှန်းချက်
ဥပမာ
ဗီဒီယိုတစ်ခု၏ ကစားပုံအနေအထား ပြောင်းသွားသောအခါ၊ ဗီဒီယို၏ လက်ရှိအနေအထားကို စက္ကန့်ပိုင်းအတွင်း ပြသပါ-
// Get the <video> element with id="myVideo"
var vid = document.getElementById("myVideo");
// Assign an ontimeupdate event to the <video> element, and execute a function if the current playback position has changed
vid.ontimeupdate = function() {myFunction()};
function myFunction() {
// Display the current position of the video in a <p> element with id="demo"
document.getElementById("demo").innerHTML = vid.currentTime;
}
အောက်တွင် နောက်ထပ် "စမ်းသုံးကြည့်ပါ" ဥပမာများ။
အဓိပ္ပါယ်နှင့် အသုံးပြုမှု
အော်ဒီယို/ဗီဒီယိုတစ်ခု၏ ကစားသည့် အနေအထားကို ပြောင်းလဲသွားသောအခါ အချိန်မွမ်းမံမှု ဖြစ်ရပ် ဖြစ်ပေါ်သည်။
ဤဖြစ်ရပ်ကို ဖိတ်ခေါ်သည်-
- အသံ/ဗီဒီယိုကို ဖွင့်ခြင်း။
- ပြန်ဖွင့်သည့် အနေအထားကို ရွှေ့ခြင်း (အသုံးပြုသူသည် အသံ/ဗီဒီယိုရှိ အခြားနေရာသို့ အမြန်သွားသည့်အခါကဲ့သို့)
အကြံပြုချက်- ဤအချိန်မွမ်းမံမှုဖြစ်ရပ်ကို စက္ကန့်ပိုင်းအတွင်း အသံ/ဗီဒီယိုဖွင့်ခြင်း၏ လက်ရှိအနေအထားကို ပြန်ပေးသည့် Audio/Video Object ၏ currentTime ပိုင်ဆိုင်မှု နှင့် အတူတွဲသုံးလေ့ရှိသည် ။
Browser ပံ့ပိုးမှု
ဇယားရှိ နံပါတ်များသည် အဖြစ်အပျက်ကို အပြည့်အဝထောက်ခံသည့် ပထမဆုံးဘရောက်ဆာဗားရှင်းကို သတ်မှတ်ပေးပါသည်။
| Event | |||||
|---|---|---|---|---|---|
| timeupdate | Yes | 9.0 | Yes | Yes | Yes |
အထားအသို
HTML တွင်-
<audio|video ontimeupdate="myScript">
JavaScript တွင်-
audio|video.ontimeupdate=function(){myScript};
JavaScript တွင် addEventListener() method ကိုအသုံးပြု၍-
audio|video.addEventListener("timeupdate", myScript);
နည်းပညာဆိုင်ရာအသေးစိတ်
| ပံ့ပိုးထားသော HTML တဂ်များ- | <audio> နှင့် <video> |
|---|---|
| ပံ့ပိုးထားသော JavaScript အရာဝတ္ထုများ- | အသံ ဗီဒီယို |
နောက်ထပ် ဥပမာများ
ဥပမာ
အော်ဒီယိုတစ်ခု၏ ကစားသည့် အနေအထား ပြောင်းသွားသောအခါ၊ အသံ၏ လက်ရှိအနေအထားကို စက္ကန့်ပိုင်းအတွင်း ပြသပါ-
// Get the <audio> element with id="myVideo"
var aud = document.getElementById("myVideo");
// Assign an ontimeupdate event to the <audio> element, and execute a function if the current playback position has changed
aud.ontimeupdate = function() {myFunction()};
function myFunction() {
// Display the current position of the audio in a <p> element with id="demo"
document.getElementById("demo").innerHTML = aud.currentTime;
}
ဥပမာ
လက်ရှိပြန်ဖွင့်သည့်နေရာကို 5 စက္ကန့်သတ်မှတ်ရန် currentTime ပိုင်ဆိုင်မှုကို အသုံးပြုခြင်း-
document.getElementById("myVideo").currentTime = 5;
❮ HTML အသံ/ဗီဒီယို DOM ရည်ညွှန်းချက်