Animate css is not working in both CDN and downloded file

I tried to use Animate.css (https://animate.style/) to animate some text in a html file but the text is not animated.

I used 2 methods but both do not seem to work:

  1. from a CDN

and

  1. I downloaded directly from github from https://raw.githubusercontent.com/daneden/animate.css/master/animate.css

Here's my code:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css">
    <title>Animate.css</title>
<!-- <link rel="stylesheet" type="text/css" href="style.css"> -->
</head>
<body>
    <h1 class="animated infinite jello">Animate Me</h1>
</body>
</html>

May I know which part of my code went wrong. Appreciate your kind advice.

1 answer

  • answered 2022-01-23 04:07 Najme

    you are missing underlines between the animation name and the class. look at this example:

    <h1 class="animate__animated animate__bounce">An animated element</h1>
    

    After installing Animate.css, add the class animate__animated to an element, along with any of the animation names (don't forget the animate__ prefix!):

How many English words
do you know?
Test your English vocabulary size, and measure
how many words do you know
Online Test
Powered by Examplum