Javascript Plugin Conflict

Question

Hi,

I want to use DrawFill SVG javascript plugin (https://github.com/callmenick/Draw-Fill-SVG) to animate an svg logo whilst pages load. This animation works works fine outside of canvas but I get an error using in canvas. I have included the modernizr dependency, but this still throws an error -

TypeError: Modernizr.prefixed is not a function. (In 'Modernizr.prefixed("transition")', 'Modernizr.prefixed' is undefined)

Do you have any thoughts please. My website is spaces2020.com.

Thanks

Nick

SemiColonWeb · Accepted Answer

Hello,

Firstly, we see a Serious Issue with your Code. Please find the following code in the Page:

data-loader-html="
       
    

    

    

"

and replace it with:

data-loader-html='
       
    

    

    

'

Secondly, do make sure that you add the modernizr JS Linking and any other Javascript Plugin Linking at the bottom of the Page just before the js/functions.js JS File Linking.

This should automatically fix your issue. Let us know if we can help you with anything else or if you find any further issues.

nickwild · Answer

Hi,

Many thanks for your advice. It now shows the logo during, without the errors but it just shows the SVG file and does not perform the drawfillsvgfunction (I have included the demo at spaces2020.com/test that works).

Do you have any further advice?

Many thanks

Nick

Semicolon Web · Answer

Hello, We have checked out your Website and the issue was that you are Calling the DrawFillSVG Function before it is initialized in the Footer. Additionally, the Initialization JS Code for the DrawFillSVG Function should be placed inside the jQuery Document Ready Function. We have created a Sample …

nickwild · Answer

This great thanks. Excellent customer service!