Hi, I am wondering how to give animations to vaadin components. For example, mouse over a label and some content then slide down; move the mouse away, the content slides back up. Thanks!
Hi,
That sounds like an effect that can be easily achieved with
CSS animations
and the
:hover selector
.
There’s also an add-on called the
Animator
, which you can use to get the same CSS effects applied from the server side. Take a look at the
online demo
and you’ll see examples of the kind of sliding effect you’re describing. Listening to mouseover events to trigger the Animator will require some JavaScript or client-side coding. I’d go with CSS animations unless there’s a need to lazily load the contents only when the event occurs.
Hope this helps,
Olli