Three approaches to work with SVG to create peel off page effect
Because I had trouble with browsers compatibility I experimented with all 3 approaches
- On page.html page I did the effect using css (animation clip-path @keyframes)
- It is very easy approach, with css you can do quite a lot for this situation but it's not compatible with older versions of IE and IPhone browser
- On page-htmlsvg.html page same effect is done using only HTML SVG
- Html can be a little trickier to learn but it very powerful, you can do more then css, but still animate tags probably will not work on all older browsers
- On page-snapsvg.html page same effect I did using Snap.svg.js library
- Quite easy to learn, similar to jquery, and because it's JS can give you more flexibility