https://github.com/rnowosielski/interactive-help
JavaScript providing interactive help behaviour on a webpage
https://github.com/rnowosielski/interactive-help
help interactive-help tooltips user-experience walkthrough
Last synced: about 1 year ago
JSON representation
JavaScript providing interactive help behaviour on a webpage
- Host: GitHub
- URL: https://github.com/rnowosielski/interactive-help
- Owner: rnowosielski
- Created: 2017-02-11T14:22:31.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2017-02-15T18:12:42.000Z (over 9 years ago)
- Last Synced: 2025-02-07T13:23:32.816Z (over 1 year ago)
- Topics: help, interactive-help, tooltips, user-experience, walkthrough
- Language: JavaScript
- Size: 106 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.MD
Awesome Lists containing this project
README
# Interactive help extension
This is a simple script that adds simple bootstrap-popover interactive help to a webpage
When prototyping or developing MVPs I often find myself wanting to priovide documentation that is as close to the user as possible, but would be cheap to include at the same time.
This script allows me to put documentation snippets together with the application code and easily and cheaply expose it to the users of my app.
## How does it look like
When using vanilla bootstrap 3 the exaple looks something like this
## How to use it in the code
In order to use the script, make sure that JQuery and Bootstrap are included in your page
```html
```
afterward including the script `interactiveHelp.js` should do the trick (for example by using e.g. https://rawgit.com)
All you need to do in you HTML do document elements is to provide at least those fields in the html tag
```
data-help="" data-toggle="popover" data-placement="auto" data-content=""
```
and add a class `helpButton` to the control that should initiate the interactive help.
## Example
The [example.html](./example.html) file is a simple usage example.