来自 赵鹏 | November 23, 2018
Xaringan 的动画转场效果，可以用 animate.css 实现。只需在 yaml 里声明一下 animate.css 的路径，然后每张幻灯片开头声明一下 class 即可（或者用 layout 来批量控制连续若干片子的转场效果）。
下面是个完整的 Rmd 文件示例：
---
title: "zoomOutUp"
output:
xaringan::moon_reader:
css:
- default
- default-fonts
- "https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css"
lib_dir: libs
---
layout: true
class: inverse, center, middle, animated, zoomIn
---
# Yeah, Xaringan has animations...
---
# if animate.css!
---
layout: false
class: inverse, left, center, middle
# Click me and press the left or right arrow to see the zoomOutUp effect.
---
下面是开头幻灯片的 gif 动画版（感谢 @zhouyisu 制作）。
下面是 animate.css 提供的 77 个转场效果示例。点击片子按箭头键即可预览。
bounceIn
bounceInDown
bounceInLeft
bounceInRight
bounceInUp
fadeIn
fadeInDown
fadeInDownBig
fadeInLeft
fadeInLeftBig
fadeInRight
fadeInRightBig
fadeInUp
fadeInUpBig
flipInX
flipInY
jackInTheBox
lightSpeedIn
rollIn
rotateIn
rotateInDownLeft
rotateInDownRight
rotateInUpLeft
rotateInUpRight
slideInDown
slideInLeft
slideInRight
slideInUp
zoomIn
zoomInDown
zoomInLeft
zoomInRight
zoomInUp
bounce
flash
headShake
heartBeat
hinge
jello
pulse
rubberBand
shake
swing
tada
wobble
bounceOut
bounceOutDown
bounceOutLeft
bounceOutRight
bounceOutUp
fadeOut
fadeOutDown
fadeOutDownBig
fadeOutLeft
fadeOutLeftBig
fadeOutRight
fadeOutRightBig
fadeOutUp
fadeOutUpBig
flipOutX
flipOutY
lightSpeedOut
rollOut
rotateOut
rotateOutDownLeft
rotateOutDownRight
rotateOutUpLeft
rotateOutUpRight
slideOutDown
slideOutLeft
slideOutRight
slideOutUp
zoomOut
zoomOutDown
zoomOutLeft
zoomOutRight
zoomOutUp