Text change animation css

h1:before{
    content: 'Original Text';
    font-size: 600%;
    animation-name: head;
    animation-duration: 4s;
    animation-iteration-count: infinite;
}

@keyframes head {
    0% {font-size:600%; opacity:1;}
    25% {font-size:570%; opacity:0;}
    50% {font-size:600%; opacity:1;}
    65% {font-size:570%; opacity:0;}
    80% {font-size:600%; opacity:1; content: "Changed Text"}
    90% {font-size:570%; opacity:0;}
    100% {font-size:600%;opacity:1; content: "Original Text"}
}

Source: stackoverflow.com

Similar codes

1 vote230 views1 answer
Css custom bullet list
CSS
-1 vote246 views1 answer
Remove line breaks css
CSS
0 vote219 views1 answer
Container media queries for large displays
CSS
6 votes285 views2 answers
How do you make each word in a text start with a capital letter?
CSS
168 votes220 views4 answers
Css link tag
CSS
6 votes221 views6 answers
Css text highlight
CSS
0 vote204 views1 answer
Nhandled Rejection (TypeError): Cannot read property
CSS
27 votes217 views1 answer
Css how to create gradients on text outline
CSS
1 vote239 views1 answer
Css p tag text wrap
CSS
11 votes223 views2 answers
Css display
CSS