Directory

Animate-CSS

Animate.CSS : Just-add-water CSS animations

View larger

Close

A cross-browser library of CSS animations. As easy to use as an easy thing. See http://daneden.github.io/animate.css .

Vaadin Flow version.

Sample code

package com.infraleap.vaadin;

import com.infraleap.animatecss.Animated;
import com.vaadin.flow.component.button.Button;
import com.vaadin.flow.component.notification.Notification;
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
import com.vaadin.flow.router.Route;

/**
 * The main view contains a button and a click listener.
 */
@Route("")
public class MainView extends VerticalLayout implements Animated {

    public MainView() {

        this.animate(Animation.BOUNCE_IN_LEFT);

        Button button = new Button("Click me",
                event -> Notification.show("Clicked!"));
        add(button);
    }
}

Links

• View on GitHub
• Online Demo, showing the effects included

Compatibility