Swipe to Reveal Technique
Posted in Interactive Email, Kinetic Email by Justin On November 8, 2017. 1 Comment
Check out this swipe to reveal technique created by Daniel Sivan from Wired Messenger Inc. This technique overlays a div with an image over a div container and uses left padding on the overlay div to “push” the image to the right of the container – leaving a “handle” that the user can use to drag the content into view.
View in CodePen
Its a pretty simple technique and works best in mobile (works in the Gmail app as well) since the interaction is more intuitive. Although it can also be used in desktop the user would have to scroll using the scrollbar.
Alternatively you can use media queries to display the swipe interaction in mobile and tablets and a hover based reveal interaction in the desktop.
Tried it on the Gmail app – it only shows the hidden image, clickable. The red image doesn’t actually show up. Any idea if Gmail will start supporting this soon?