zoukankan      html  css  js  c++  java
  • audio做音频,更加重新播放让svg根据播放重新渲染

    之前帮人家做过一个小功能,

    利用audio音频标签去重复播放,引用了一段svg,跟audio一起播放

    然后出现了audio可以重复播放,但是svg不重新播放,搜了很多svg自带的方法都没有能够使他重新播放

     

      // window.onload = function () {
          var oMedia = document.getElementById("media");
          //play()和autoplay开始播放时触发
          var svg = document.getElementsByTagName("svg")[0];
          console.log(svg);
          var svgs = document.getElementById("svgs");
          svg.pauseAnimations();

          oMedia.addEventListener("play", function () {
            //在这里写代码
            // document.getElementById("imgsrc").src = "./assets/image/way1.svg";
            var element = document.querySelector("svg");
            var cloneElement = element.cloneNode(true);
            element.parentNode.replaceChild(cloneElement, element);
          });
          oMedia.addEventListener("ended", function () {
            //在这里写代码
            document.getElementById("imgsrc").src = "./assets/image/template.svg";
          });
  • 相关阅读:
    CSS团队协作规范
    百度前端学院-基础学院-第四课
    百度前端学院-基础学院-第三课
    百度前端学院-基础学院-第二课
    vue(三)-父子组件通信
    setTimeout()与clearTimeout()
    vue(二)-父子组件语法
    vue(一)使用vue-cli搭建项目
    CSS table-layout 属性
    git学习
  • 原文地址:https://www.cnblogs.com/qingcui277/p/12711133.html
Copyright © 2011-2022 走看看