Add sharp edges to your Modules as it scrolls into and out of view
The Polyfold AddOn has a “Top Edge” and “Bottom Edge” option that can be enabled together or individually, and the settings for both are identical.
Enable the edge effect for the top or bottom of the Module.
2. Disable on Mobile
Choose to disable the effect on mobile devices.
3. Background Color
The background color of what’s drawn. This should match the same color as your page’s content.
4. Draw from
Start the drawing from the outermost sides or from the center of the Module.
5. Draw Edges
Choose if the edges should be drawn above all content or behind the Module’s navigation or Static Layers.
Choose if the drawing height should adjust itself responsively as the Module resizes.
7. Inverse Drawing
Reverse the drawing edge’s starting origin point.
8/9. Left/Right Width
Choose a width in percentage for the left and right parts of the drawing.
10. Maximum Height
The maximum height the shape will draw to.
11. Draw on Scroll
Choose to draw the edges when the page is scrolled, or disable this option for a static view.
12. Drawing Range
Choose if the calculations should be based on the Module’s current height or the entire window’s height.
13. Drawing Transition
Add an optional CSS transition when the drawing occurs.
A CSS easing equation for the transition.
15. Invert Scroll
Choose to reverse the drawing depending on which direction the page is scrolled.
16. Transition Duration
The total time the drawing transition will take place in seconds.