Skip to content

Custom animations in tooltips. #13622

@nanuclickity

Description

@nanuclickity

Problem

Tooltips only support fade animation. here
Animations should be capable of being outsourced to css.

Benefit: You can use libraries like animate.css in tooltips.

Solution

Integration of custom css animation classes.

To enable tooltip animation you pass { animation: true },
after this you can pass { animation: 'animated bouceInDown'}
and tooltips will automatically use this string as animation class.

Take animate.css for example, it's an awesome collection of CSS3 based animations.

Initialization is kept simplistic.

Dynamic Initialization

$(".music-menu").tooltip({
  animation: 'animated bounceInDown'
});

Auto Initialization

<span data-animation="animated bounceInDown" data-toggle="tooltip" title="Gryffindor"></span>

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions