Hi EvilGeniousCreative – I believe I have a very similar issue, so let me join your thread.
Using Edge about a year ago, I made front-page animation for a website, which I hosted with Muse.
I have not paid much attention to this front page animation during the past 5 month; but re-visiting it now (in Chrome), it turns out that some of the elements in my animation are no longer visible. I have not changed the animation, so I am assuming that something in Chrome has changed.
It seems that the elements that are missing from my animation are all Rectangular AND non-black colored AND have animated opacity tracks.
It also seems that this issue only arises in Chrome (there is no problem in Firefox)
When I open the animation in Edge I can see the missing elements in the editor-window and their animations seem to be working fine - But when I preview the animation in my Chrome browser (i.e. not using Muse, just the preview option in Edge) the elements do not show up.
To illustrate the problem, take a look at the front page of my website [ www.bewersdorflab.org ] and notice the animation when you hover over the “projects” option: A microscope-thing comes out of the black orb; but the green laser (which I made out of a bunch of colored rectangles) does not show up… any ideas why Chrome does not display the green laser while Firefox does?
I have had this problem in chrome with objects that are gone. At this point IE was much higher, it objects are visible. I do not know if it makes sense but I decided to create symbols of objects that did not appear on the screen.
It's something to do with the z-index of items that are wrapped in other items. Still, would be nice if someone from Adobe replied to this. I guess we can suck it.
I have the same problem.
But in safari it's the same.
And in Canary Chrome no. It's very rare.
Safari has the same problem because it uses Webkit technology. In IE it appears.
1 person found this helpful
"It's something to do with the z-index of items that are wrapped in other items"
I'm having this issue as well. When the animation is running the object appears on screen properly, and then as it continues the z index abruptly changes so the element is hidden behind ones that it shouldn't be.
Yup, clearly it's a known issue that's not getting anything done about it as you can tell from the GLARINGLY OBVIOUS LACK OF Adobe tech folks replying to this thread. As in zero. Hmmmm.... Trying to be patient here, Adobe, but seriously?
I have the same problems in Chrome. When i have a rectangle and an image and combine them to a Symbol it disappears in Chrome. When i open the Developer Tools or resize the window they appear. ADOBE PLEASE FIX!
I'm desperate for a fix for this, too... I've wasted hours trying to rejig stuff that, previously, would have worked just fine. I'm at my wits' end
Hi. How did you manage to get it work?
I have Symbols wrapped into a div and put the following code to the STAGE (creationComplete):
Symbol_9 is a Symbol inside the "PFEILE" div. In the HTML Code the Div has the ID "Stage_PFEILE".
But it does not work. The symbols are still not visible.
The elements that weren't showing up in my project are all on the main timeline; so I just plonked the code there rather than in creationComplete (see top pic showing code which targets an element named 'arrow3' on my main timeline ).
If your symbols or elements are nested it might be worth ensuring they're targeted more accurately (see bottom pic showing additional path info).
Hope this helps fix things for you.
i tried everything you said, but it is still not working. The css is added, but the symbols do not appear. See code here:
For this i added this to the stage Complete: