Reveal image and push content smoothly

[BC Development 8 Likes (Newbie)]

Hi, I have an animation that I'm having issues with. I'm trying to reveal a text while also push the logo at the same time (look video reference) but I can't do it smoothly. On my codepen it shows a big jump for the logo image once the text is reveled.

Any help on how can I solve this?

See the Pen BaYXjRM by godhandkiller (@godhandkiller) on CodePen

[SteveS 177 Likes (Specialist)]

The way you are trying to make the image appear won't work. There's a number of ways to do this, but I animated a clip-path. Definitely needs some tweaking, but this is the general idea:

See the Pen abqedjy by SteveSDaBest (@SteveSDaBest) on CodePen

[BC Development 8 Likes (Newbie)]

 

19 hours ago, SteveS said:

The way you are trying to make the image appear won't work. There's a number of ways to do this, but I animated a clip-path. Definitely needs some tweaking, but this is the general idea:

 

 

Thank you for your solution, the only issue that I see is that the logo is not centered in the screen

[SteveS 177 Likes (Specialist)]

@BC Development It's up to you to figure out how you want to do that. The main mistake you were making was that you where hiding the element then setting it to visible. The general example I provided should give you the basis needed to make the effect you are looking for.