How to use the animejs.running function in animejs

To help you get started, we’ve selected a few animejs examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github DefinitelyTyped / DefinitelyTyped / types / animejs / animejs-tests.ts View on Github external
tl.finished.then(() => {
	console.log("I wonder if anyone will ever actually read this.");
});

const usesEnums = anime({
	targets: ".usingEnumsIsAReallyHandyThing",
	direction: "reverse",
	easing: "inoutexpo",
	someProperty: "+=4000"
});

const bezier = anime.bezier(0, 0, 100, 100);
// anime.speed = 100000000;
(anime as any).speed = 4000;
anime.easings['hello'] = anime.bezier(0, 0, 1900, 3020);
const runningAnims = anime.running;
anime.remove(".tiny-divvy-div");

anime.timeline().add({
	targets: [],
	duration: 1000,
	easing: "linear",
}, 0);

anime({
	targets: ".mizi",
	keyframes: [
    {translateY: -40, delay: 123},
    {translateX: 250},
    {translateY: 40},
    {translateX: 0},
		{translateY: 0}
github MoeFE / GoogleTranslate / src / renderer / components / Select.tsx View on Github external
private async handleMouseEnter(value: string, uid: number) {
    if (this.disableMouseEnter) {
      // 键盘 up 和 down 操作会自动处理滚动条
      // 当滚动条改变后如果鼠标还在语言范围内会再次触发 mouseenter 事件
      // 为了避免视觉抖动执行 up 和 down 操作时不要执行原逻辑
      this.disableMouseEnter = false;
    } else {
      if (anime.running.length > 0) {
        // 动画过程中设置 selectedValue 会导致动画卡顿
        await Promise.all(anime.running.map(x => x.finished));
        await sleep(100);
      }
      this.selectedValue = value;
      this.selectedOptionId = uid;
    }
  }
github mattdesl / jsconfeu-generative-visuals / src / createArtwork.js View on Github external
function clear() {
    // stop all animations, clear shapes
    stoppedAnimations.length = 0;
    anime.running.forEach(a => a.pause());
    anime.running.length = 0;
    traverse('onTrigger', 'clear');
  }
github MoeFE / GoogleTranslate / src / renderer / components / Select.tsx View on Github external
private async handleMouseEnter(value: string, uid: number) {
    if (this.disableMouseEnter) {
      // 键盘 up 和 down 操作会自动处理滚动条
      // 当滚动条改变后如果鼠标还在语言范围内会再次触发 mouseenter 事件
      // 为了避免视觉抖动执行 up 和 down 操作时不要执行原逻辑
      this.disableMouseEnter = false;
    } else {
      if (anime.running.length > 0) {
        // 动画过程中设置 selectedValue 会导致动画卡顿
        await Promise.all(anime.running.map(x => x.finished));
        await sleep(100);
      }
      this.selectedValue = value;
      this.selectedOptionId = uid;
    }
  }
github mattdesl / jsconfeu-generative-visuals / src / createArtwork.js View on Github external
function clear() {
    // stop all animations, clear shapes
    stoppedAnimations.length = 0;
    anime.running.forEach(a => a.pause());
    anime.running.length = 0;
    traverse('onTrigger', 'clear');
  }
github MoeFE / GoogleTranslate / src / renderer / store.ts View on Github external
async () => {
    await Promise.all(anime.running.map(x => x.finished));
    await sleep(300);
    const {
      autoLaunch = false,
      isAlwaysOnTop = true,
      shortcutKeys,
      translateSelection,
    } = $store.state;
    try {
      if (autoLaunch) {
        await googleTranslateAutoLauncher.enable();
      } else if (await googleTranslateAutoLauncher.isEnabled()) {
        await googleTranslateAutoLauncher.disable();
      }
    } catch (ex) {
      // eslint-disable-next-line no-new
      const notice = new Notification({
github mattdesl / jsconfeu-generative-visuals / src / createArtwork.js View on Github external
function stop() {
    if (!running) return;
    stoppedAnimations = anime.running.slice();
    stoppedAnimations.forEach(r => r.pause());
    anime.running.length = 0;
    running = false;
    window.cancelAnimationFrame(raf);
  }