Vue项目中用的Jquery.js和easing.js做的抛物线

Posted 2021-01-28 黑夜蓝天

如果项目中还用到自有的$

<script>
  jQuery.noConflict();
</script>

//星星掉落
movePathNew(args) {
  let self = this;
  let targetDiv = jQuery(‘.maodianFlag‘);
  let $fxImg1 = args.clone().css({
    ‘position‘: ‘absolute‘,
    ‘z-index‘: 10000,
    ‘width‘: args.width(),
    ‘height‘: args.height(),
    ‘border-radius‘: ‘50%‘
  }).css(args.offset()).appendTo(‘#app‘);
  args.hide();
  $fxImg1.animate({
    left: [targetDiv.offset().left + targetDiv.width() - $fxImg1.width(), ‘linear‘],
    top: [targetDiv.offset().top + targetDiv.height() - $fxImg1.height(), ‘easeInBack‘]
  }, 650).fadeOut(50, function () {
    $fxImg1.detach();
    self.aComputedFlag++;
    console.log(self.aComputedFlag);
  });
},
//分别调用星星掉落轨迹
movePathAll(all, moveFlags, ll) {
  let self = this;
  for (let i of all) {
    self.movePathNew(jQuery(i));
  }

},