reveal.js - Auto Animate

Auto-Animate Example

This will fade out


						function Example() {
						  const [count, setCount] = useState(0);
						}

Auto-Animate Example

This will fade out

This element is unmatched


						function Example() {
						  New line!
						  const [count, setCount] = useState(0);
						}

Line Height & Letter Spacing


							import React, { useState } from 'react';

							function Example() {
							  const [count, setCount] = useState(0);

							  return (
							    ...
							  );
							}


							function Example() {
							  const [count, setCount] = useState(0);

							  return (
							    <div>
							      <p>You clicked {count} times</p>
							      <button onClick={() => setCount(count + 1)}>
							        Click me
							      </button>
							    </div>
							  );
							}


							function Example() {
							  // A comment!
							  const [count, setCount] = useState(0);

							  return (
							    <div>
							      <p>You clicked {count} times</p>
							      <button onClick={() => setCount(count + 1)}>
							        Click me
							      </button>
							    </div>
							  );
							}

Swapping list items

One
Two
Three

Swapping list items

Two
One
Three

Swapping list items

Two
Three
One

SLIDE 1

Animate Anything

SLIDE 2

With Auto Animate

SLIDE 3

With Auto Animate

SLIDE 3

With Auto Animate

data-auto-animate-id="a"

A1

data-auto-animate-id="a"

A1

A2

data-auto-animate-id="b"

B1

data-auto-animate-id="b"

B1

B2

Slide 1
Slide 2
Slide 3
Slide 4