Looking to create a customized link effect.
Number 14 is what I’m trying to create from this list: Creative Link Effects
Is this possible in Webflow?
Are you referring to this one?
Yes, it is absolutely possible.
And you will not need any custom code, just use interactions with Hover trigger.
Use link-block with text inside. Add 2 divs inside, which will have a width about 2 px and use absolute positioning for put them on the sides. It will be lines.
Create interaction for the link-block with 2 Hover triggers. Every trigger should affect one of the lines. Don’t forget to check the option “Limited to nested elements”.
Inside the trigger use step Move+Rotation (movement should be first)
Results: http://sapdesign-sandbox.webflow.io/creative-hover-link-effect
Here you can open the site in Webflow and see all details https://webflow.com/website/SAPDesign-sandbox (page: “Creative hover link effect”)
Cheers,
Anna
1 Like