Driver. JS - open source and independent interactive guidance tool library for web novices, powerful and highly customizable

Can quickly achieve the novice guidance effect , Bring your own animation , Experience excellence , And it can be highly customized .

About Driver.js

Driver.js It is a tool that can easily realize novice guidance interaction javascript Tool library , Its main function is to quickly understand the product for novice users who have just come into contact with the application , Help users focus on a function , So as to quickly get familiar with our developed products , Cut off the post star Has been up to 13.5k！

Driver.js The technical characteristics of

• Simple and light ： It's easy to use , Independent and independent , Only 4kb size
• Highly customizable ： Have rich and powerful API, According to the need to use
• Good interactive experience ： Support animation transition , Feel smooth and comfortable
• Highlight anything ： Support for highlighting any... On the page dom Elements
• A few simple steps to achieve function introduction ： For us Web Great feature introduction for application creation , Experience excellence
• User friendly ： You can control the guidance process through the keyboard , It is very practical in the application of generative force
• Browser compatibility is consistent ： Support for almost all browsers （ Including famous IE）

Development hands-on use and suggestions

Both development APP still web application , Novice guidance is a common requirement , Usually here 2 Three aspects need novice guidance ：

Recently developed requirements , Because of the great changes in the revision , You need to give instructions . Novice guidance function with good interactive experience , Including dynamic effect 、 Mask and element positioning , It takes time and effort to develop , And today's introduction Driver.js I spent a lot of time to find a very useful novice guide tool library , It's very powerful , The most important thing is to be able to highly customize , A pursuit like mine 100% Restore the front end of the design draft , It's nice to be able to customize your code as you like .

Driver.js Supported by npm or yarn To install , such as ：

It can also be introduced online or locally , Attention should be paid to introducing CSS file ：

The easiest way to use it is to highlight an element , Just give one CSS A selector is enough ：

Adjust the position of the pop-up box ：

All of the above are minor incidents , The most commonly used method in novice boot interaction is multi-step boot , The user can understand the function step by step , It is also very simple to achieve this effect ：

It's really cool , It's really easy to use ,CSS We can also write our own CSS Style to customize the mask style , This will perfectly match our application style . There are more powerful features in the documents on the official website , Interested developers can read it carefully .

Free open source instructions

Driver.js It's a free javascript Tool library , The author is Kamran, The source code is based on MIT Open source licenses Hosted in Github On , Any individual or company can download and use for free , It can also be used in commercial projects .

Link to the original text ：https://www.thosefree.com/driver-js