animate rotate page

revision b6a490e09692c62ede869e453ef4235aa23d513d

raw

rotate.css

1
2
3
4
5
6
7
8
9
10
body {
    background-color: red;
    animation: foo 10s infinite;
}
@keyframes foo {
  0%   { transform: rotate(0deg); }
  33%   { transform: rotate(-10deg); }
  66%   { transform: rotate(10deg); }
  100% { transform: rotate(0deg); }
}
raw

test.htm

1
2
3
4
5
6
7
8
9
10
11
12
13
<html>
 <head>
  <title>Test rotate page</title>
  <link rel="stylesheet" href="rotate.css" />
 </head>
 <body style="background-color: grey">
  <h1>Rotate a page with CSS</h1>
  <p>
   This is a test.
  </p>
 </body>
</html>
 

History