Streaming live at 10am (PST)

Weird flickering in Safari


#1

Hi! I've ran into this problem with safari... That is.... Well I figured it would be easiest to explain it with a video... so here you go: blush

The problem is this "flickering"/loading delay appearing on page changing (as you can clearly see here)...
Hope that some of you guys, who knows more about this than me can help me out here! smiley

(P.s tried to find a solution for the problem my self... but honestly I don't really now what the problem actually is smile ... )
Here is the sharing link for the project: https://preview.webflow.com/preview/struer-friskolev2?preview=4375a481552bc67167b9c859843b0abb which is by the way a school website blush

Best,
Jonatan


#2

Lol! Jonhatan I LOVED the video (: Piano and intermission cracked me up.

Ok to begin with, select the element that flickrs and give it the highest Z-index in your page... Click on position:relative and put a high value in the z-index.

If it doesn't fix it, come back for some tortured custom code.


#3

Haha! Glad you liked the video smile

Unfourtunately that didn't seem to fix the problem...
So yay! Bring the torture on! blush sunny


#4

Just for info: Weirdly enough it seems like that on my older Macbook Pro running Safari 7.1.2 the problem doesn't seems to appear at all...! ? So could it be just a problem with my computer? (Though the only plugins i have installed in Safari is Adblock (Which I by the way have tried deactivating, but with no luck pensive) OR just with the newer update of Safari..?


#5

My bad, sorry, your video was too distracting and I didn't even understand the question... I thought there was some flickering but you have a loading issue that makes an element move (right?)

So give dimensions in px to your .logo element and it will stop.

(PS I don't reproduce the issue on Safari myself)


#6

Thanks a lot for your help Vincent! smiley
Yearh.. I realized that "flickering" was not the correct term relaxed - Sorry my bad!

So giving the dimensins in px did work, and actually I had also tried it (I know that sounds very stupid)..!

But then this border appeared around the .logo element on loading ... But I have just done a huge discovery! ( arrow_left - read that ironically)
– You can add border:0px; to html and that will do it.. kissing_closed_eyes notes..... relaxed So.. sorry for bothering with this smile! But at least i got a nice video out of it.. blush

-

Best to you! Have a good one!
Cheers! All the best from Denmark!! smile
By the way @vincent just wanted to say thanks on behalf of well.. all webflow users for the huge help that you provide here in the forum blush You're really doing a great piece of work! smile


#7

So you got how it works right? And why it affects only Safari... Browers have defaults value to display html elements. They vary from a browser to another. Specifying zero actually change from default to zero. Webflow has a resest css file to deal with browser defaults, to even them.


#8

I'm having a similar experience with my website (http://bokonlinebanking.webflow.io/).

Vincent: I sent you a private message.


#9

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.