Hi, I’m using animagic stack which is working perfectly well on Voyager Pro, but the same page using the Navigator theme fails to run the animation correctly. Only the first animation is working and the other ones don’t even show up.
Share the trouble URL with us please.
Sorry, I must have overlooked the theme name you were inquiring about when I responed originally. Once I saw the theme you were using I knew exactly why it was not doing what you expect. Navigator’s navigation effects require that the scrolling of the page be locked in place. The content scrolls, but it does so within a container. Animagic specially pays attention to whether the page is scrolling or not and uses that to trigger the animations. Since the page does not scroll in Navigator, only that fixed position content area scrolls within itself, Animagic can not trigger an animation.
So, what is the solution ? Get rid of the Navigator Theme ? I have another issue with another stack (I opened another ticket for that one). Seems that the Navigator theme is not working like it should.
Navigator is working as it is supposed to, it just doesn’t scroll the page as other themes do. Navigator’s navigation effects are just very unique in how they work. Not every tool will be compatible with every theme, and vice versa. Tools that trigger off of scrolling, such as Animagic, are just not compatible with Navigator’s structure.
But it is your theme and your stack…
That doesn’t make the two technologies compatible.
Navigator’s navigation effects require that the scrolling of the page be locked in place. The content scrolls, but it does so within a container. Animagic specially pays attention to whether the page is scrolling or not and uses that to trigger the animations. Since the page does not scroll in Navigator, only that fixed position content area scrolls within itself, Animagic can not trigger an animation.
I can’t change that Animagic needs to trigger off of the page scrolling – that’s just how that technology works, and Navigator’s design structure requires the page to be locked in place and the content scroll instead of the page itself to make the layout and animations work as they should.