HOW TO: make custom pop up modals in Webflow the easy way
91.5 هزار بار بازدید -
5 سال پیش
-
Build your fundamentals in Webflow
Build your fundamentals in Webflow by learning how to create a custom pop up modal! Links to everything in the description! Help us teach more people by leaving us a like and a comment.
This method of making a pop up modal in Webflow uses the built in interactions. they key parts of the build are that your modal is set to fixed so that it will be in the same spot no matter the scroll position and the z index places it over top of everything else. To make it work we are going to set the contact button as a trigger for the animation and change it from display: none, to display:block. When the pop up is visible we can use opacity to smooth the transition. Same thing in reverse to hide the pop up but set the trigger as the close icon.
Say hello!
Instagram Instagram: anansi_creative
Facebook Facebook: anansicreativecanada
https://www.anansicreative.com/
Tools used for this project
https://webflow.com/
This method of making a pop up modal in Webflow uses the built in interactions. they key parts of the build are that your modal is set to fixed so that it will be in the same spot no matter the scroll position and the z index places it over top of everything else. To make it work we are going to set the contact button as a trigger for the animation and change it from display: none, to display:block. When the pop up is visible we can use opacity to smooth the transition. Same thing in reverse to hide the pop up but set the trigger as the close icon.
Say hello!
Instagram Instagram: anansi_creative
Facebook Facebook: anansicreativecanada
https://www.anansicreative.com/
Tools used for this project
https://webflow.com/
5 سال پیش
در تاریخ 1398/09/15 منتشر شده
است.
91,593
بـار بازدید شده