You are previewing Instant IntroJs.
O'Reilly logo
Instant IntroJs

Book Description

Learn how to work with the IntroJs library to create useful, step-by-step help and introductions for websites and applications

  • Learn something new in an Instant! A short, fast, focused guide delivering immediate results

  • Quickly look up the features of the IntroJs library

  • Create step-by-step help and introductions for websites with minimum programming experience

  • Contains many examples of introductions including multi-page introductions

  • Learn how to customize and develop the IntroJs library

  • Learn how to use IntroJs with other server-side frameworks

In Detail

IntroJs is a JavaScript and CSS3 library, used to create simple step-by-step help pages or introductions for websites and applications to show the users new features or whole application parts quickly and concisely. Instant IntroJs is a reference to get started with IntroJs right away.

Instant IntroJs teaches you how to work with key IntroJs methods and events to create awesome step-by-step introductions. This book contains numerous examples of introductions and help pages with detailed explanations. It also shows you how to customize the library with your preferred stylesheet or integrate it with other server-side frameworks.

Instant IntroJs teaches you how to work with the IntroJs API, methods, and events to create step-by-step introductions for websites and applications.

This book will give you the knowledge to make the preferred changes to IntroJs in order to build a customized introduction. Instant IntroJs provides many examples of introductions and helps you with using HTML attributes and JSON configurations, as well as some descriptions about how to use and integrate IntroJs with other server-side libraries, such as Ruby on Rails and PHP Yii. You will be provided with information about the latest features of IntroJs that include multi-page introductions, creating introductions using JSON configuration and HTML attributes, methods to change or customize the library, and more.

Instant IntroJs provides full and detailed examples of step-by-step introductions to help you easily learn and use the latest version of the IntroJs library.

Table of Contents

  1. Instant IntroJs
    1. Instant IntroJs
    2. Credits
    3. About the Authors
    4. About the Reviewers
      1. Support files, eBooks, discount offers and more
      1. Why Subscribe?
      2. Free Access for Packt account holders
    7. 1. Instant IntroJs
      1. So, what is IntroJs?
        1. Usages
        2. Features
      2. Installation
        1. Step 1 – requirements
        2. Step 2 – downloading JavaScript and CSS
        3. Step 3 – configuration
          1. Using the <script> tag
          2. AMD and CommonJs
        4. And that's it
      3. Quick start
        1. Step 1 – defining elements
          1. Using element attributes
            1. The data-intro attribute
            2. The data-step attribute
            3. The data-position attribute
          2. Using JavaScript objects (JSON)
        2. Step 2 – calling the start() method
          1. Hello World
          2. How it works
      4. Top 7 features you need to know about
        1. Options
          1. steps
          2. nextLabel
          3. prevLabel
          4. skipLabel
          5. doneLabel
          6. tooltipPosition
          7. exitOnEsc
          8. exitOnOverlayClick
          9. showStepNumbers
        2. API
          1. introJs.start()
          2. introJs.goToStep(stepNo)
          3. introJs.exit()
          4. introJs.setOption(option, value)
          5. introJs.setOptions(options)
          6. introJs.oncomplete(providedCallback)
          7. introJs.onexit(providedCallback)
          8. introJs.onchange(providedCallback)
          9. introJs.onbeforechange(providedCallback)
        3. Method chaining
        4. Integrating IntroJs with other frameworks
          1. Ruby on Rails
            1. Installation
          2. Yii Framework
            1. Installation
            2. Usage
          3. Overlay
          4. Tool tips
          5. Buttons
            1. introjs-tooltipbuttons
            2. introjs-button
            3. introjs-prevbutton
            4. introjs-nextbutton
            5. introjs-skipbutton
          6. Numbers
          7. Highlight area
        5. Localization and the Right to Left version
          1. Changing button labels
          2. RTL
          3. Building projects
          4. Getting ready
          5. make build
        6. Events and callbacks
          1. oncomplete
          2. onexit
          3. onchange
          4. onbeforechange
        7. Multipage introduction
          1. How it works
            1. Changing the Done button label
            2. Redirecting the user to the next page
            3. Starting the introduction on the second page
      5. People and places you should get to know
        1. IntroJs official website
        2. Blogs
        3. API documentation
        4. The GitHub repository
        5. Issue tracker
        6. Communities
          1. Google group
          2. Stackoverflow
        7. Twitter and personal blogs