• Resolved CravenLovelace

    (@cravenlovelace)


    Okay, after giving up on my Edge header animation last week, because I couldn’t get it to be responsive with Sarah Justine’s code (and indeed, it broke the entire page’s responsiveness), I am trying again using the new native responsiveness feature in Edge Animate 3.0. It no longer breaks my page’s responsiveness (the flexbox elements below still work as expected) but I have a new problem. Now, when I load my page, I get javascript errors saying the plugin can’t find the two PNG images used in the animation, and it displays only white space where the header ought to be. I’ve never seen this particular error before. Any advice?

    The page is https://cometbang.com.

    https://www.ads-software.com/plugins/edge-suite/

Viewing 15 replies - 1 through 15 (of 18 total)
  • Plugin Author ti2m

    (@ti2m)

    Please try the latest dev version as linked in the FAQ, I updated the plugin yesterday to work with 3.0, but for now these changes are only in the dev version. Please let me know if that works for you, not that many people have tested it yet.

    Thread Starter CravenLovelace

    (@cravenlovelace)

    Thanks, Timm. Will do!

    Thread Starter CravenLovelace

    (@cravenlovelace)

    Well, that did change the syntax of the Javascript error I was getting before, but it still can’t find the images. It reports:

    GET https://cometbang.com/images/Construction_Page_Logo_Only.png 404 (Not Found) edge.3.0.0.min.js:240
    GET https://cometbang.com/images/Construction_Page_Logo_Ship.png 404 (Not Found) edge.3.0.0.min.js:240

    Just for grins, I tried creating an “images” folder in my root directory and copied the contents of the OAM’s images folder into it. Now the animation DOES appear, and I no longer get the error message — BUT the animation is super-tiny! I have left it up on the site in case you want to look at it.

    Thread Starter CravenLovelace

    (@cravenlovelace)

    When I use “Inspect Element,” I see that the animation is loaded within a div with a class of “center-wrapper.” I think this may be the culprit, as it is set to the strange dimensions of 301px x 63px. I don’t know where these numbers came from. I’m going to experiment with adding a line of custom CSS to see if I can override that size for “center-wrapper.”

    Thread Starter CravenLovelace

    (@cravenlovelace)

    Well, that didn’t work. I definitely think something is going on with either the div class “center-wrapper” or the div class “flow-wrapper,” or both. They have very odd dimensions in my DOM.

    Plugin Author ti2m

    (@ti2m)

    Hi,
    creating a special image folder is not a good way to solve this in general, as its supposed to work out of the box. I didn’t mention that, but did you reupload the composition? Otherwise it won’t work as Edge Suite needs to replace some parts of the original JS and that changed with the latest version.

    If you don’t mind, can you sent me the OAM ([email protected]), you also get some jquery 2 map 404’s, which I heard about but wasn’t able to reproduce so far.

    Thread Starter CravenLovelace

    (@cravenlovelace)

    Okay. I deleted the old OAM and my new “images” folder. I then re-uploaded the OAM and changed my shortcode to reflect the new Edge animation ID number. Now, I do not get the Javascript errors — but I also no longer see the animation. This time, it’s not even inserting the extra white space as it was before. It’s just as if there is no header on the site. I’m sending you the OAM right now. Thanks, Timm.

    Thread Starter CravenLovelace

    (@cravenlovelace)

    Well, apparently I (along with most of the rest of the world) am having problems with Gmail. I’ll send the OAM as soon as ?G?o?d? Google permits.

    Plugin Author ti2m

    (@ti2m)

    Hi, thanks for sending the OAM. I tested it and it all works for me. When checking your site I have a JS errors again. It’s coming from custom.js, simple syntax error. Maybe that’s the issue, because as said, the OAM works for me and seems to be ok in general.

    Thread Starter CravenLovelace

    (@cravenlovelace)

    Well, I eliminated that syntax error (annoyingly caused by a third party plugin), and now am getting no Javascript errors at all in the console. But the animation still doesn’t show. It’s so frustrating to be this close!

    Plugin Author ti2m

    (@ti2m)

    Hey,
    for testing, try to not center the stage. I just played around with the inline css on your site and I got the composition to come up. So it’s all there and working in general, it just doesn’t show due to responsive / centering. Had some issues with that yesterday as well, so try to get the basic case working and then add responsive options one by one and see where it breaks.

    Thread Starter CravenLovelace

    (@cravenlovelace)

    Okay. Sounds good, Timm. I’ll keep messing with it on my end as time permits. It’s important to me that the animation be responsive, but I actually don’t want it to be centered — I must have activated that by mistake. I appreciate your having taken as much time with this as you have already.

    Thread Starter CravenLovelace

    (@cravenlovelace)

    Timm, I finally had the chance to resave the Edge animation without centering the stage, and — it worked! Mostly, anyway. I now get my animation playing, and it scales down correctly if I reduce the browser window. The only thing that seems a bit odd to me is that if I then rescale the browser back up, the animation does not scale back up with it. Still, this represents a big step forward for me!

    Plugin Author ti2m

    (@ti2m)

    Hi,
    glad to hear it kind of works. Getting the same issue on your page as well, can you test it inline with a shortcode? There the resizing worked for me when resizing the browser window, but it doesn’t have the correct size on page load. Would be good if you can double check with your new composition. Will try to do some more testing on it, have to see when I have time for this. In general, if you like the plugin, please consider voting for it, thanks.

    Thread Starter CravenLovelace

    (@cravenlovelace)

    Okay, I tried it on a page (you can see it at https://cometbang.com/greensock-tester-3/) and it IS working correctly there. I don’t know if this makes any difference, but even in my header, I was using the shortcode (via a text widget in a Dynamik-defined widget area).

    I’ll definitely vote for the plugin. It fills a much needed niche and I very much appreciate your generous tech support.

Viewing 15 replies - 1 through 15 (of 18 total)
  • The topic ‘Edge 3.0 Animation – Can't Find Images’ is closed to new replies.