Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
wumperloo

Problems integrating animated SVG in WordPress

Recommended Posts

Hi there,

 

I just started to work with GSAP and I made my first animated SVG. I developed everything local and now I wanted to integrate it in my WordPress site.

 

The inline SVG has round about 1000 lines and wordpess some how struggles with this much lines. The result is that the svg looks broken and parts of it are missing. So I integrated the svg with <object></object> now it looks proper.

 

I also enqueued all scripts but the animation is just not starting. In the console I can't see any errors related to this.

 

Any of you more experienced guys may have a look at my work? I hope you can see what I did wrong on a glance!

 

Here is the link

 

 

Some background information:

 

I use a caching plugin and a CDN but allready tried it without caching and CDN... no result.

 

Thanks in advance!

 

  • Like 1
Link to comment
Share on other sites

Hi and welcome to the GreenSock forums.

 

I'm seeing a lot of errors related to jQuery not being defined or present. Will be very difficult to know why your SVG animation isn't working until those are fixed

 

http://prntscr.com/ajx9e8

Link to comment
Share on other sites

Also, its very difficult for us to chase down where you animation code is or the code that loads the svg.

 

Since we can't edit your code you should add some console logs that verify the following

 

1: the SVG is in the DOM before you try to query elements (like paths, rects, g, etc)

2: once the SVG is loaded and accessible you should verify that your selectors are correct. 

 

This post should be of great help. http://greensock.com/forums/topic/12321-non-inline-svg-and-control-with-gsap/

I recommend Blake's ajax solutions:  http://plnkr.co/edit/khmnvLO3JfWRTkSuami4?p=preview

  • Like 1
Link to comment
Share on other sites

Thanks for the advices Carl! I will read the resources you posted...

Link to comment
Share on other sites

  • 2 weeks later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×