【代码分享】自定义视频的进度条（控制块）

 
发布链接

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
 
作品中添加代码的地方在
 


 
 
 
在以下公众号回复“视频进度块”，获取本文的源文件链接