vue小球动画

技术文章 6个月前 完美者
1,799 0

标签:sel   sele   定位   动画   translate   nbsp   cti   ansi   lag   

 beforeEnter: function(el) {
      // 通过绝对定位,小球css的top和left值一直都是固定的
      //不管怎么滚动,小球的x y坐标固定
      el.style.transform = "translate(0,0)";
    },

    enter: function(el, done) {
      //小球x y的移动距离要用终点-起点
      el.offsetLeft;
      let s = document
        .querySelector(".mui-input-numbox")
        .getBoundingClientRect();
      let f = document.querySelector(".mui-badge").getBoundingClientRect();
      let x = f.left - s.left;
      let y = f.top - s.top;
      el.style.transform = "translate(" + x + "px," + y + "px)";
      el.style.transition = "all 1s cubic-bezier(.37,-0.3,1,.28)";
      done();
    },
    afterEnter: function(el) {
      this.flag = !this.flag;
    },

vue小球动画

标签:sel   sele   定位   动画   translate   nbsp   cti   ansi   lag   

原文地址:https://www.cnblogs.com/uniapp1/p/13489105.html

版权声明:完美者 发表于 2020-08-12 15:52:47。
转载请注明:vue小球动画 | 完美导航

暂无评论

暂无评论...