麻烦快速转发,使用javascript在iOS上倒带视频

时间:2018-11-26 15:33:23

标签: javascript html5-video current-time

我有一些可以在ios上播放和暂停的视频,但是不能正确倒带或快进。当您尝试快进20秒时,视频将始终进入视频的20秒。我看到ios在currenttime方面遇到了麻烦,但是我不确定如何将这些知识整合到我的代码中。有人可以帮忙吗?

javascript:

let vid;
        document.addEventListener('DOMContentLoaded', init);

        function init(){
            var btnsPlay = document.getElementsByClassName('btnPlay');
            var btnsSound = document.getElementsByClassName('btnSound');
            var btnsRew = document.getElementsByClassName('btnRew');
            var btnsFF = document.getElementsByClassName('btnFF');
            for(var i = 0; i < btnsPlay.length; i++) {
                btnsPlay[i].addEventListener("click", play);
                btnsSound[i].addEventListener("click", sound);
                btnsRew[i].addEventListener("click", rew);
                btnsFF[i].addEventListener("click", ff);
            }

        }

        function play(ev){

            var thisVideo = this.parentNode.parentNode.children[1]; //this button's video
            var vid = thisVideo;
            let mediaType = vid.type;
            let str = vid.canPlayType("video/mp4");
            vid.volume = 0.9;  //  0 - 1
            vid.muted = true;


            if(! vid.paused){
              vid.pause();
              this.firstChild.classList.remove("fa-play");
              this.firstChild.classList.add("fa-pause");
            } else {
              vid.play()
            .then(()=>{
              this.firstChild.classList.remove("fa-pause");
              this.firstChild.classList.add("fa-play");
            })
            .catch((err)=>{
                console.log( {err} );
            });


            }

        }

        function sound(ev){
            var thisVideo = this.parentNode.parentNode.children[1]; //this button's video
            var vid = thisVideo;
            //console.log(this.parentNode.parentNode.children[3]);

          if (vid.muted) {
            vid.muted = false;
            this.firstChild.classList.remove("fa-volume-mute");
            this.firstChild.classList.add("fa-volume-up");
            //document.getElementsByClassName('display-captions').style.opacity = 0;
            //$('.display-captions').css('opacity',"0");

            this.parentNode.parentNode.children[3].style.opacity = 0;


          } else {
            vid.muted = true;
            this.firstChild.classList.remove("fa-volume-up");
            this.firstChild.classList.add("fa-volume-mute");
            this.parentNode.parentNode.children[3].style.opacity = 1;
          }
        }

        function rew(ev){
            var thisVideo = this.parentNode.parentNode.children[1]; //this button's video
            var vid = thisVideo;
            if(isiOS) {

                vid("canplaythrough",function() { 
                    vid("progress",function() { 
                        vid.currentTime = seekToInitially;
                        //????
                    });
                });
            }

            if( ! vid.fastSeek ){
                vid.currentTime -= 20;
            }else{
                vid.fastSeek(-20)
                .then(()=>{

                })
                .catch(err=>{
                    console.log({err});
                })
            }

        }
        function ff(ev){
            var thisVideo = this.parentNode.parentNode.children[1]; //this button's video
            var vid = thisVideo;
            if( ! vid.fastSeek ){
                vid.currentTime += 20;
            }else{
                vid.fastSeek(20)
                .then(()=>{

                })
                .catch(err=>{
                    console.log({err});
                })
            }

        }

0 个答案:

没有答案