11 Awesome “jQuery Site Tour Plugins” For Guiding Users With Style It is always hard to guess how users browse + how they perceive the content and flow of a website or web app. There are tools to analyze these as much as possible and, using methods like A/B testing, improving the usability is always possible. However, it is always a great idea to guide users whenever they want. Nothing to lose on that for sure. There are awesome jQuery plugins that ease guiding users and creating site/page tours for them. Intro.js A lightweight plugin that uses data attributes and has keyboard navigation support. It focuses on objects beautifully and pretty easy-to-setup. aSimpleTour aSimpleTour uses a JSON data for all the configuration and content. While a floating box helps managing the tour, tooltips (that can be positioned however wanted) help focusing on the elements. Pageguide.js Pageguide.js offers a very slick way to provide site tours. Joyride This is a very nice plugin by the talented ZURB team. Website Tour Bootstro.js That is the Bootstrap version of Intro.js. P.S.
BigVideo.js - The jQuery Plugin for Big Background Video The jQuery Plugin for Big Background Video (and Images) This plugin makes it easy to add fit-to-fill background video to websites. It can play silent ambient background video (or series of videos). BigVideo.js is built on top of Video.js from zencoder. You can read about how to use BigVideo.js below. DOWNLOAD: zip tar examples bower install BigVideo.js Setup BigVideo.js uses the Video.js api. To simply play a video that takes up the entire browser window (like in this example), do this: For crossbrowser fallbacks, you can include a source order with different video formats. Ambient Video To play silent video in the background of a page (like in this example), use BigVideo’s ambient setting: Or play a series of ambient background videos (like in this example) Keep in mind that mobile devices do not allow video autoplay. Video.js Because BigVideo.js is built on top of Video.js, you can use the Video.js api. BV.getPlayer().pause(); Tips For best results, I recommend using Vimeo.
Responsive Nav — Responsive Navigation Plugin Unheap - A tidy repository of jQuery plugins lunrjs.com mattduvall.com okfnlabs.org/recline/