EnjoyHint works by dimming out the whole page and leaving only a small cut-out over the element you want to highlight and bring into focus.
Along with the page dimming layer, some text and an arrow pointing to the cut-out can be shown as well, giving users important instructions about how to use that element, or for what's it for.
Next and Skip buttons are shown as well, buttons for easily advancing through the tour, or just skipping the entire thing.
Any element on the page that can be selected via jQuery can be highlighted, and the shape of the highlight can be a circle or rectangle.
The text can be shown in any of the highlighted element's corners, making sure it is always visible and in the center of the page.
Mobile devices and touch gestures are also supported with EnjoyHint, along with proper cross-browser rendering.
A demo ships with the download package.
Requirements:
- JavaScript enabled on client side
- jQuery 1.7 or higher
- KineticJS 5.1 or higher
Comments not found