top of page

Input Animation with Velo



Velo Code:


import { timeline } from 'wix-animations';

$w.onReady(function () {
    const placeholder = $w('#placeholder');

    if ($w('#input1').value.length > 0) {

    } else {
        timeline()
        .add(placeholder, {scale: 1, y:0, x:0, duration: 400, easing: 'easeOutCirc'},0)
        .play();
    }

    $w('#input1').onClick(() => {
        const clicked = {y:-18,x:-80,scale:.5, duration:400, easing: 'easeOutCirc'};

        if ($w('#input1').value.length > 0) {

        } else {
            timeline()
            .add(placeholder,clicked,0)
            .play();
        }
    });
});

Enjoy!

Comments


bottom of page