Esta es una manera muy ilustrativa de como dar un Tour del sitio web a un usuario común (en muchos casos enseñar al usuario las cosas que se pueden conseguir en el sitio web), con jQuery.

Solo se necesitar añadir la libreria jQuery, añadir el código .js y crear los box que contendran la explicación del tour.

<div>
	<h2>crear un tour</h2>
	<p>Aquí irá el texto del tooltip, ...</p>
</div>

Lo que sigue es crear el el objeto JSON con los siguientes parametros:

• name
• bgcolor
• color
• text
• time
• position

var config = [
	{
		"name" 		: "tour_1",
		"bgcolor"	: "black",
		"color"		: "white",
		"position"	: "TL",
		"text"		: "Some text here",
		"time" 		: 5000
	},...
]

Al principio parece algo confuso por lo largo que se hace el objeto pero es bastante intuitivo y sencillo de usar.

Demo | Website Tour Demo

Descarga y Documentación | Website Tour with jQuery