Hi everyone, I’ve added a blur effect to a div, but now it seems to break the animation on my tab buttons. You’ll see that the tab width jumps after it has been clicked instead of a smooth transition. I’ve tested it and it seems to work if I remove the blur effect from the Custom Code section.
They function identically on my machine. Using Chrome on a Mid-2012 MacBook Pro. Although, to be honest, I don’t see a difference between the two pages at all outside of the fact that on one the background slides out and on the other it just fades.
Is it possible your computer is being overwhelmed by the processes and is just unable to display the tab animation smoothly?
Hmm… Intersting. It could be Safari. Not so sure it’s my computer though. It’s pretty strong.
Yes, they are identical. Except for the bug I mentioned. There’s 2 states here:
1.Hover and tab protrudes by 10px to a width of 310px.
2.Click and it protrudes to a width of 320px to become active state.
All of this animation happens with a smooth transition. But the code seems to break the transition so it jumps to 320px width after clicked.
I’ll check it when I’m in front of my desktop again. Cant test that breakpoint on my phone.