Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

322
Visualizações
svg trigger animation issue (svgator)

Can you tell me why this example http://www.silkcutz.co.uk/test/ taken from here https://github.com/SVGator/trigger-animation which uses (logo.svg with ID "e6flsqoxhzzs1") works absolutely fine....

BUT http://www.silkcutz.co.uk/test/2.html (using Untitled.svg with ID "eOKHP9YQpje1") doesnt, this is a very simple animation of a box moving position (just for test purposes).

Both html files are very simple and should require only the filename and ID changing but the examples 2.html... you would think the svg has issues but when testing the SVG file (Untitled.svg) using the upload svg facility on the live demo here https://www.svgator.com/help/getting-started/svgator-player-js-api it work fine and is triggered as expected!

Any help would be very much appreciated!

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

To use the technique described there, you need to export the SVGator project using "Animation start: On click".

But programmatic animation has been recently implemented. Check these resources: https://www.svgator.com/help/getting-started/animate-programmatically https://www.svgator.com/help/getting-started/svgator-player-js-api

Here's a complete example on how to use Player API with a SVG embedded in an tag:

<!DOCTYPE html>
<html>
   <head>
      <title>Testing SVG</title>
      <script>
         //Wait for the document to load
            document.addEventListener("DOMContentLoaded", function() {
                //grab the <object> element
                let object1 = document.getElementById('animated-svg');

                //Wait for the content of the <object> to load
                object1.addEventListener("load", function() {
                    //grab the <svg> element
                    let svg = object1.contentDocument.getElementById('e5478wvxh25l1');

                    //Wait for the SVGtor player to be ready for use
                    svg.svgatorPlayer.ready(function(player) {
                        //inset your code here; i.e.
                        player.play();
                    });
                });
            });
      </script>
   </head>
   <body>
      <object id="animated-svg" type="image/svg+xml" data="animated.svg" style="height: 857px;"></object>
   </body>
</html>

It's also worth knowing that no matter how you set the "Animation start", you always have access to the Player API and can control the animations as a PRO user.

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda