11 superb jquery step-by-step guidance plug-ins

When a website or a Web application introduces new features, a step-by-step guide is often added to the site (Application) to help users understand how your site (or application) operates. However, this effect is a headache for those who do not understand native Js.

The following describes some jquery plug-ins that can help you achieve step-by-step guidance. You can customize them according to your needs. They all have a stylish appearance and are easy to use.

1. Intro. js 

Intro. js uses a guided method to introduce the new features of your website and project step by step. Supports keyboard + mouse navigation.

2. asimpletour 

Asimpletour uses JSON data for storage configuration and content. A floating window helps you manage the browsing and tooltip of key elements (which can be located ).

3. pageguide. js 

Pageguide. JS is an interactive visual web page wizard component implemented by jquery and css3. It can be used to generate friendly help prompts through pageguide. js.

4. joyride 

Joyride is a jquery plug-in that can be used to create a wizard that guides users through website functions. By defining the sequence of operations, this plug-in displays a tooltips for help description next to the HTML element to be operated.

5. Website tour 

A simple but practical plug-in. All details and content are defined in Js. It also provides options to define the position and color of the tooltips.

6. bootstro. js 

This is the bootstrap version of intro. js.

7. Bootstrap tour 

This jquery website navigation loads content in Bootstrap popovers. The navigation steps and content are defined in Javascript. It has many options to define its behavior.

8. jquery site tour 

This plug-in has many options to determine the latency between the appearance and steps, set the project to be initially displayed, and so on.

9. jquery tourbus 

This plug-in is developed using coffeescript + less + CSS, which is very easy to customize and allows you to manually display other steps or play automatically. You can use a function to obtain the current step or display a specific step.

10. Trip. js 

All Bootstrap steps and content are defined in JS. It has a complete API, supports callbacks and keyboard, and allows custom appearances.

11. crumble 

Crumble uses the bubble interface, and all the steps are defined in an ordered list.