Pauzowanie animacji GIF

Question

Witam!

Czy da radę zapauzować animację GIF?

W moim kodzie mogę uruchomić animację i zatrzymać ją. Ale ponowne kliknięcie na przycisk to odtwarzanie animacji od początku. 

Może jest jakiś sposób, żeby manipulować animacją? Może coś w stylu ustawiania currentTime?

 

 <div class="gifWrapper">
        <img src="Comp_static.gif" alt="" class="gif">
        <button class="gifRun">Animate</button>
    </div>

 

const gifImg = document.querySelector(".gif");
const animateBtn = document.querySelector(".gifRun");
let run = false;


animateBtn.addEventListener("click", function () {
    if (!run) {
        this.textContent = "Stop it!"
        gifImg.setAttribute("src", "Comp 1.gif");
        run = !run;
    } else {
        this.textContent = "Animate";
        gifImg.setAttribute("src", "Comp_static.gif");
        run = !run;
    }

});

 

Answer 1

Przejrzyj sobie ten temat:

https://stackoverflow.com/questions/2385203/can-you-control-gif-animation-with-javascript

Tak jak juz pisza możesz albo użyć css sprite i rozbić gif na klatki w jpg / png lub użyć https://github.com/buzzfeed/libgif-js