CODEWITHSUNDEEP
cssranimate.cssxaringan
Leonardo Ribeiro
Leonardo Ribeiro

Reputation: 105

Animate Xaringan figures and text

I want to animate some elements inside the slides in my Xaringan presentation.

I am aware on how to animate slide transitions as especified in the link below (https://www.garrickadenbuie.com/blog/animate-xaringan-slide-transitions/).

What I really want is the possibility of using such animations in a text or image of a slide.

When looking at the animate.css file I can see some classes, for example:

.pulse { -webkit-animation-name: pulse; animation-name: pulse; }

But when I try to use in RMardown like this:

.pulse[Some text]

Nothing happens.

I was hoping for a solution which would ideally allow me to choose all the possible animations (https://daneden.github.io/animate.css/).

Upvotes: 2

Views: 623

Answers (1)

Emi
Emi

Reputation: 3584

If you do .pulse[Some text] it convert it to <span class="pulse">Some text</span>. A couple of things to animate it here:

  • you need to add the class animated
  • change it to div instead. You can do this by starting ] in a new line.

So this should work (given that you have animate.css included):

.pulse.animated[Some text
]

Upvotes: 2

Related Questions