Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

101
Vistas
json animation won't show up on my website?

Hi I'm a complete beginner so I'm sorry for my messy code (I also apologize for my english in advance).

I'm currently trying to code a website for myself and I made a blender animation which I edited with after effects and then exported with bodymovin. I don't know if I linked my script.js wrong or something else but I followed tons of videos and nothing seems to work because it just won't show up on my website or I get errors in my script.js . I hope I'm posting my code here correctly.

HTML:

<div id="cloud"></div>
<script src="lottie.js"></script>
<script src="script.js"></script>

Script.js

var animation = bodymovin.loadAnimation({
    container: document.getElementById('cloud')
    renderer: 'svg',
    loop: true
    autoplay: true,
    path: 'Cloud_1.json' 
})

Thanks in advance!

EDIT:

My animation is a moving cloud. I use Brackets but It's nowhere to be seen on the website.

I currently have an error at

`renderer: 'svg', 

And these are all the errors that I've gotten:

'bodymovin' was used before it was defined. var animation = bodymovin.loadAnimation({ 3
Expected 'renderer' at column 1, not column 5. renderer: 'svg', 3
Expected '}' to match '{' from line 1 and instead saw 'renderer'. renderer: 'svg', 3
Expected ')' to match '(' from line 1 and instead saw ':'. renderer: 'svg', 3
Expected ';' and instead saw 'svg'. renderer: 'svg', 3
Expected 'svg' at column 1, not column 15. renderer: 'svg', 3
Expected an assignment or function call and instead saw an expression. renderer: 'svg', 3
Expected ';' and instead saw ','. renderer: 'svg', 3
Expected ',' at column 1, not column 20. renderer: 'svg', 3
Expected an identifier and instead saw ','. renderer: 'svg', 3
Stopping. (42% scanned). renderer: 'svg',

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Add the Lottie CDN to the header of your file:

<script src="https://cdnjs.cloudflare.com/ajax/libs/bodymovin/5.8.1/lottie.min.js" integrity="sha512-V1YyTKZJrzJNhcKthpNAaohFXBnu5K9j7Qiz6gv1knFuf13TW/3vpgVVhJu9fvbdW8lb5J6czIhD4fWK2iHKXA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

And replace

var animation = bodymovin.loadAnimation({
    container: document.getElementById('cloud')
    renderer: 'svg',
    loop: true
    autoplay: true,
    path: 'Cloud_1.json' 
})

By

var animation = lottie.loadAnimation({
    container: document.getElementById('cloud')
    renderer: 'svg',
    loop: true
    autoplay: true,
    path: 'Cloud_1.json' 
})
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda