Narcissistic Passion Minified

    howtodo

    1.0.34 • Public • Published

    How to do

    Installation

    Use NPM

    npm i howtodo
    

    Or use CDN

    When you only need to include Howtodo's compiled JS, you can use jsDelivr.

    <script src="https://cdn.jsdelivr.net/npm/howtodo@1.0.34/wizard.min.js"></script>
    

    About this Project

    The library is an advanced tool that also assists you in a simple and time saving onboarding of new members to your company. In the new era of Work from Home Culture, a lot of platforms have emerged to assist your user while they are working to ensure a consistent and hassle free flow, for example Gramarly assist you while typing instantly to point out errors and the tone of your text.

    With 'How To Do', you can include this library in your system to explain the functioning of your website to your users and customers in an interactive and self explanatory manner.

    previewImg

    Usage

    Just By these simple steps you can show anyone "How to do this?" Anywhere in you website.

    HTML

    Include the wizard.js file at the bottom of your html file

    <script src="https://cdn.jsdelivr.net/npm/howtodo@1.0.32/wizard.min.js"></script>

    JavaScript

    Make a new instance howToDoWizard and pass the values.

    var instruction = new howToDoWizard();
    
    // to start a fun session
    instruction.play(topicId, autoplay, interval,navigation); 

    Now You dont have to create a DIV with id instructionsModal

    Description
    id Generated topic id
    autoplay By default it is :false
    interval time in which the next step will be executed. By default it is :3000ms
    navigation By default it is :true (back and next)

    If you dont have the generated id then you can pass your instruction like this:

    var myInput = {
      title: "How To Fill This Form ?",
      instruction: [
        {
          id: 1,
          title: "Enter your Emil Id here ..",
          elementId: "emailId",
          example: { placeholder: "john@example.com", text: "" },
        },
        {
          id: 2,
          title: "Enter your password here",
          elementId: "password",
          example: {
            placeholder: "ab@12hs",
            text: "Do not tell or Share this with anyone.",
            imageUrl: "",
            audioUrl: "",
          },
        },
      ],
    };
    
    var instruction = new howToDoWizard();
    
    // to start a fun session
    instruction.play({myInput, autoplay, interval,navigation});

    Otherwise you can create and manage all your topics in one place. With only few steps you will be able to guide your user anywhere in you website.

    To create Click here

    A simple Example showing how the Widget will look with diffrent example options

    With Image in it

    previewOFaWidget

    With Text in it

    previewOFaWidget

    Thank You

    Contact me if you have any issue.

    mobile : +91 9506370145
    email : y.sandeep@outlook.com

    Install

    npm i howtodo

    DownloadsWeekly Downloads

    2

    Version

    1.0.34

    License

    ISC

    Unpacked Size

    25.2 kB

    Total Files

    6

    Last publish

    Collaborators

    • avatar