W3C home > Mailing lists > Public > public-css-archive@w3.org > July 2019

Re: [csswg-drafts] [css-animation] Motion Blur (#3837)

From: Jake Archibald via GitHub <sysbot+gh@w3.org>
Date: Thu, 25 Jul 2019 11:32:24 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-515008404-1564054343-sysbot+gh@w3.org>
You could deal with the looping cases by getting the developer to provide keyframes beyond the start and end of the animation:

```css
@keyframes square-spin {
  -100% { transform: rotate(-0.25turn); }
  from { transform: rotate(0turn); }
  to { transform: rotate(0.25turn); }
  200% { transform: rotate(0.5turn); }
}
```

In this case a solid square rotates in a way that looks constant, even though it's only rotating 1/4. By providing -100% and 200% values, the blur would look convincing.

-- 
GitHub Notification of comment by jakearchibald
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3837#issuecomment-515008404 using your GitHub account
Received on Thursday, 25 July 2019 11:32:26 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:41:50 UTC