kamrify commited on
Commit
bceba74
·
1 Parent(s): e09eecc

Add images and update version

Browse files
Files changed (4) hide show
  1. README.md +31 -11
  2. demo/images/driver.png +0 -0
  3. demo/images/split.png +0 -0
  4. package.json +2 -2
README.md CHANGED
@@ -1,14 +1,34 @@
1
- ## spotlight-js
2
- > Allows highlighting any element, adding feature introduction, adding hints
3
 
4
- ## Highlighting Single Elements
 
 
 
 
 
 
 
 
 
 
5
 
6
- ```javascript
7
- const spotlight = new Spotlight({
8
- opacity: 0.7, // opacity for the background
9
- padding: 5, // padding around the element
10
- });
11
 
12
- spotlight.highlight('#some-element');
13
- spotlight.clear();
14
- ```
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <h1 align="center"><img src="./demo/images/driver.png" /> Driver.js</h1>
 
2
 
3
+ <p align="center">
4
+ <a href="https://creativecommons.org/licenses/by/4.0/">
5
+ <img src="https://img.shields.io/badge/License-CC%20BY%204.0-lightgrey.svg" />
6
+ </a>
7
+ <a href="http://makeapullrequest.com">
8
+ <img src="https://img.shields.io/badge/contributions-welcome-green.svg" />
9
+ </a>
10
+ <a href="http://twitter.com/kamranahmedse">
11
+ <img src="https://img.shields.io/badge/author-kamranahmedse-blue.svg" />
12
+ </a>
13
+ </p>
14
 
15
+ <p align="center">
16
+ <b>A powerful yet light-weight, vanilla JavaScript engine to drive the user's focus across the page</b></br>
17
+ <sub>Only ~4kb, no external dependency, supports all major browsers and highly customizable <sub>
18
+ </p>
 
19
 
20
+ <br />
21
+
22
+ * **Simple**: is simple to use and has no external dependency at all
23
+ * **Light-weight**: ~4kb in size, vanilla JavaScript and no external dependency
24
+ * **Highly customizable**: has a powerful API and can be used however you want
25
+ * **Highlight anything**: highlight any (literally any) element on page
26
+ * **Feature introductions**: create powerful feature introductions and onboarding strategies
27
+ * **Focus shifters**: add focus shifters for users
28
+ * **User friendly**: Everything is controllable by keyboard
29
+ * **Consistent behavior**: usable across all browsers (including in-famous IE)
30
+ * **MIT Licensed**: free for personal and commercial use
31
+
32
+ ![](./demo/images/split.png)
33
+
34
+ For Usage and Examples, [have a look at demo]()
demo/images/driver.png ADDED
demo/images/split.png ADDED
package.json CHANGED
@@ -1,7 +1,7 @@
1
  {
2
  "name": "driver.js",
3
- "version": "1.0.0",
4
- "description": "A light-weight, vanilla JS library to bring certain parts of page in spotlight",
5
  "main": "./assets/scripts/dist/driver.min.js",
6
  "scripts": {
7
  "start": "node server.js",
 
1
  {
2
  "name": "driver.js",
3
+ "version": "0.1.0",
4
+ "description": "A light-weight, no-dependency, vanilla JavaScript library to drive the user's focus across the page",
5
  "main": "./assets/scripts/dist/driver.min.js",
6
  "scripts": {
7
  "start": "node server.js",