How To Make a Hover Card Like a PRO in Elementor
ฝัง
- เผยแพร่เมื่อ 22 ธ.ค. 2023
- In this video, I show you how to make an amazing hover card that slides up text over the image with easy-to-follow steps using containers in WordPress Elementor.
Source Code
urielsoto.com/how-to-make-a-h...
One of the clearest explanations of my life. Thank you so much for your work!
This is what we need, simple, explanatory, and beautiful results!
I will try that one in a carousel. Liked that you showed the result at the beginning of the video. Easy like for me
This is nice. I probably would add some button on mobile or something that indicates that you need to click to expand, cause in mobile doesn't exist hover.
Yeah that is true. Maybe an arrow
nice tutorial - thanks for sharing 🙂
Great tutorial. Thank you for this.
Excellent. Thank you
thanks for sharing - nice tutorial !!
You're AMAZING!
This was very helpful. I did have to change some code on line 26. to "flex-end" instead of end. To get the hover effect to work correctly.
This is masterful
how can I do it without containers? I find using new containers makes the website load slow on the backend.
tnx! i got a problem with my header, i have a fullscreen header but after the hoover effect it changes and gets really small! any ideas?
Check the css to see any conflicts.
Thanks for this great video. Can you say what did you write on typography for size? I can't see it correctly.
clamp(25px, 2vw, 30px)
Great video can you just zoom a little bit please
I'm definitely working on that. Will do better next time.
@@UrielSoto thank you
Two problems i have here. Don't know why there must be a transition in between instead of just moving the text up. Looks really weird when the text disapears and apears back again.
To avoid the gradient layer choose a monocolor or transparent.