I need to implement play and pause control on web animated images which should play and pause on the same frame itself. Please tell me the solution if anybody know about this
Asked
Active
Viewed 4,121 times
4
-
Convert it to a video? – Kaiido Aug 20 '18 at 05:29
-
For the size consumption i have come to webp animation instead of using video. – Ganesh Krishnamoorthy Aug 20 '18 at 05:41
-
well you probably did something wrong in your calculations or conversion, videos should be smaller than animated images. – Kaiido Aug 20 '18 at 05:43
-
Webp animated images taken smaller size than video of same file – Ganesh Krishnamoorthy Aug 20 '18 at 06:09
-
Once again you probably did something wrong. Check [this link](https://corydowdy.com/blog/apng-vs-webp-vs-gif) in the section "What Should You Use". – Kaiido Aug 20 '18 at 06:14
1 Answers
4
Introduction
I was searching for myself an answer a moment ago, when i found your Question and already had some approaches to it, so i thought to share them with a post-answer [...]
Approach 1
The freezeframe.js Approach, that works with webp too.
(but without play&pause functionality on the same frame)
WEBP DEMO codepen.io/giorgosxou/pen/MWeqzgr
Approach 2
The "Gif player-parser" Approach: Could be done by creating an alternative LC-GIF-Player (gif-demo) or gif-player (gif-demo) that would (parse) work with webp.
Approach 3
My Approach kinda like the first approach, was to just change url from a static image to webp on hover or click (although i haven't implemented it yet.. Because for now i just removed them as they are not actually THAT important to me, most probably i will use gifs and aproach-2 )
Outro
I know it's not a solution to the question but definitely some kind of a helpful answer to those looking for an approach [...]
Giorgos Xou
- 1,461
- 1
- 13
- 32