1 - May not be a bug, but me using some bad mannered design approach: I have applied an interaction (this is legacy not 2.0 ) to the whole body on all of my pages to create effect of smooth preloader. It works fine, however with that effect there is a strange behavior happening with my Navbar, it should be fixed to the top of the page, but it keeps disappearing.
If you will go to the “INTRO” page, I have disabled the interaction applied on a body (btw for some reason even after doing that and publishing the site it still works ) and you can see on that page how the Navbar should work in my design, being fixed
If you go to “BLOG” page where “Opacity 1st Slide” interaction is applied to “feed-body” then you will see what happens when you scroll the page - navbar disappears and in Safari it performs even more funky movement upon scrolling up.
2 - Even disregarding first point and disabling this transaction , there is a strange thing going on with my design in Safari, when I scroll the page up very quickly. All the elements on the navbar disappear for a second and then re-appear.
Additional info so you can quickly understand how it works in my design : I’m using a “nav-solid” div inside a “Menu” symbol with interaction applied to “nav-trigger” div inside “Hero” section , in order to manipulate navbar color upon page scroll, this is also done through legacy interactions.
Let’s say the Body is a particular element that we should try to let alone and not surcharge too much with styles and interactions.
Could you just try to remove the interaction from the body, drag a new div where you’ll place all the content of your page, and affect the interaction to it, and see if it’s any better?
I did some tests on Safari and found something that works.
As I said before, drag a div under the body and drag everything inside it, except for the navbar.
Then remove the interaction from the body and apply it to the div.
Make another interaction solely for the navbar, making it appear slightly after the content, or at the same time. Then it seems it works in Safari too and the navbar keeps its fixed attribute.
Thanks @vincent I tried it and it does fix the issue, however like that the effect is not being applied to the navbar and what I am trying to achieve is a smooth appearance of the whole page.
I’ve ended up wrapping it in a div and applying interactions 2.0 to the div and separate elements in the navbar. That seem to replicate more or less my design intention.
Apart from that, all described above doesn’t solve the second bug which I reported and demonstrated in the video, when you quickly scroll the page up in Safari and navbar not showing the menu for a second.
Any comments on that?
Second glitch is fixed with re-creating this transition in interactions 2.0.1 , though I haven’t found a way to create a “pre-loader” effect on the whole page with fixed div blog , but client is happy for it to be with the menu not affected so I’ll leave it as is for now.
Upon using interactions 2.0.1 I have caught quite a few bugs, reported them in a separate subject.
