One of my clients requested the same mouse movement effect as the Canva.com homepage.
I was able to recreate the effect here in webflow with a slight mod to a script I found on canva.com ’s own blog.
http://canva-com-hero-effect.webflow.io/
I also made a version with a video in foreground - Videopic
Figured I’d share it here with the community -
https://preview.webflow.com/preview/canva-com-hero-effect?preview=1deb3e84249ec9d42ef0fc7cd4eee2bf
25 Likes
Waldo
(Waldo Broodrÿk)
June 30, 2016, 10:10pm
2
That’s so cool @Damon_Daisley_Wilson thank you so much for sharing that!
3 Likes
That’s genious! Thanks for sharing that
2 Likes
Arthur
(Arthur James)
July 1, 2016, 2:22pm
5
AWESOME!!! that is GENIUS thanks for sharing!
Arthur
2 Likes
Pretty sweet! Thank you for sharing
1 Like
Awesome thankyou for sharing this @Damon_Daisley_Wilson !
1 Like
Chavilah
(Chavilah)
January 10, 2017, 9:17pm
9
This is amazing @Damon_Daisley_Wilson , thanks for sharing!!!
Has anyone gotten this effect to work on tablet/mobile?
1 Like
mcmlxxx8
(Jay Carroll)
January 23, 2017, 11:47pm
10
@Damon_Daisley_Wilson Too cool!!! How do we find the script we need to add make the effect come to life? I can’t seem to locate it in the read only site you provided. Thanks for sharing!
1 Like
Mark_Bowen
(Mark Bowen)
January 24, 2017, 12:12am
11
I believe the information you’re looking for should be in the page details section.
If you scroll down that until you get to the Before tag then I believe that should be what you’re looking for here.
For me though, the first two links worked but the preview wouldn’t do anything at all. I was testing in Safari so no idea if that had anything to do with it though?
Best wishes,
Mark
1 Like
@mark_bowen showed you where to get the scripts.
Scripts don’t run in preview mode, you’ll have to use the links to see everything in action.
Glad you like it.
1 Like
Mark_Bowen
(Mark Bowen)
January 24, 2017, 8:58am
13
Aha! That would explain why it’s not working for me, yes!!
Thanks and thanks for sharing such a lovely effect.
Best wishes,
Mark
mcmlxxx8
(Jay Carroll)
January 25, 2017, 5:13am
14
Thanks @Mark_Bowen and @Damon_Daisley_Wilson
Can’t wait to see if I bring this life!
devagu
(Agnieszka)
March 2, 2017, 3:00pm
15
It’s amazing!!! I’m trying to do something similar, but I can not.
Can I ask you something? First, it creates two separate images? how to combine them?
Just look at the preview link in webflow, there you can see how its setup.
devagu
(Agnieszka)
March 2, 2017, 11:29pm
17
I looked, but i can’t do Do I have to buy full version?
Ben_Milloy
(Ben Milloy)
November 17, 2017, 2:10pm
18
It’s very cool! Thank you!
I know this is an old post but Im trying to create this effect except I would want the video in the background and I would want a tint over it and the mouse hover would show part of the video. If anyone could help me in achieving this effect that would be appreciated
Thanks in advance