【代码分享】自定义视频的进度条(控制块)
发布链接
https://6.u.mgd5.com/c/n20h/hwr3/index.html
扫码看效果
使用的代码如下
mugeda.addEventListener("renderready", function(){
var scene = mugeda.scene;
var myvideo = scene.getObjectByName('播放的视频');
var videodom;
var durationBtn = scene.getObjectByName('进度');
window.changeduration = function(){
videodom = myvideo.dom.childNodes[3];
console.log('btn position changed');
videodom.currentTime = videodom.duration*(scene.getObjectByName('进度').left - 100)/(500-100)
}
window.getvideoduration = function(){
if(!myvideo.dom) return;
videodom = myvideo.dom.childNodes[3];
console.log(videodom)
}
window.myScript = function(){
if(!videodom) return;
console.log(videodom.currentTime)
durationBtn.left = 100+(500-100)*videodom.currentTime/videodom.duration
}
});
代码里使用到aObject对象的dom属性。在木疙瘩里舞台上每个取了名的物体都可以用api来定位到,定位的就是它的aObject对象,aObject对象可以使用dom属性获取元素实际的dom。
api地址
https://card.mugeda.com/mugedaApiDoc/index.html
作品中添加代码的地方在
在以下公众号回复“视频进度块”,获取本文的源文件链接