Permalink
Browse files

add progress-bar example + change readme/package.json to v1.0.0

  • Loading branch information...
1 parent e2baddf commit ea5466317ab75de6f46b0b39bae7a29c2aa18d68 @afshinm afshinm committed Oct 17, 2014
Showing with 121 additions and 37 deletions.
  1. +9 −1 README.md
  2. +1 −1 bower.json
  3. +1 −1 component.json
  4. +72 −0 example/hello-world/withProgress.html
  5. +2 −0 example/index.html
  6. +1 −1 introjs.css
  7. +33 −31 minified/intro.min.js
  8. +1 −1 minified/introjs.min.css
  9. +1 −1 package.json
View
@@ -396,12 +396,20 @@ Want to learn faster and easier? Here we have **Instant IntroJs**, Packt Publish
</p>
## Roadmap
-- Fix problems with `position: fixed` and other positions
- Provide more examples
- Add more templates
## Release History
+ * **v1.0.0** - 2014-10-17
+ - Auto-positioning feature for tooltip box
+ - Add progress-bar to tooltip box
+ - Fix `z-index` issue
+ - Add dark template
+ - Fix bad sizing with Bootstrap 3
+ - Add disable interaction ability
+ - Fix code styling issues and many minor bug fixes
+
* **v0.9.0** - 2014-05-23
- Add IntroJS templates
- Add more tooltip positions (bottom-right, bottom-middle, bottom-left)
View
@@ -1,6 +1,6 @@
{
"name": "intro.js",
- "version": "0.9.0",
+ "version": "1.0.0",
"description": "A better way for new feature introduction and step-by-step users guide for your website and project.",
"keywords": ["demo", "intro", "introduction"],
"homepage": "http://usablica.github.com/intro.js/",
View
@@ -2,7 +2,7 @@
"name": "intro.js",
"repo": "usablica/intro.js",
"description": "Better introductions for websites and features with a step-by-step guide for your projects",
- "version": "0.9.0",
+ "version": "1.0.0",
"main": "intro.js",
"scripts": [
"intro.js"
@@ -0,0 +1,72 @@
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <title>With Progress-bar</title>
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta name="description" content="Intro.js - Better introductions for websites and features with a step-by-step guide for your projects.">
+ <meta name="author" content="Afshin Mehrabani (@afshinmeh) in usabli.ca group">
+
+ <!-- styles -->
+ <link href="../assets/css/bootstrap.min.css" rel="stylesheet">
+ <link href="../assets/css/demo.css" rel="stylesheet">
+
+ <!-- Add IntroJs styles -->
+ <link href="../../introjs.css" rel="stylesheet">
+
+ <link href="../assets/css/bootstrap-responsive.min.css" rel="stylesheet">
+ </head>
+
+ <body>
+
+ <div class="container-narrow">
+
+ <div class="masthead">
+ <ul class="nav nav-pills pull-right" data-step="5" data-intro="Get it, use it.">
+ <li><a href="https://github.com/usablica/intro.js/tags"><i class='icon-black icon-download-alt'></i> Download</a></li>
+ <li><a href="https://github.com/usablica/intro.js">Github</a></li>
+ <li><a href="https://twitter.com/usablica">@usablica</a></li>
+ </ul>
+ <h3 class="muted">Intro.js</h3>
+ </div>
+
+ <hr>
+
+ <div class="jumbotron">
+ <h1 data-step="1" data-intro="This is a tooltip!">Progress-bar</h1>
+ <p class="lead" data-step="4" data-intro="Another step.">This is the basic usage of IntroJs, with <code>data-step</code> and <code>data-intro</code> attributes.</p>
+ <a class="btn btn-large btn-success" href="javascript:void(0);" onclick="javascript:introJs().setOption('showProgress', true).start();">Show me how</a>
+ </div>
+
+ <hr>
+
+ <div class="row-fluid marketing">
+ <div class="span6" data-step="2" data-intro="Ok, wasn't that fun?" data-position='right'>
+ <h4>Section One</h4>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis augue a neque cursus ac blandit orci faucibus. Phasellus nec metus purus.</p>
+
+ <h4>Section Two</h4>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis augue a neque cursus ac blandit orci faucibus. Phasellus nec metus purus.</p>
+
+ <h4>Section Three</h4>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis augue a neque cursus ac blandit orci faucibus. Phasellus nec metus purus.</p>
+ </div>
+
+ <div class="span6" data-step="3" data-intro="More features, more fun." data-position='left'>
+ <h4>Section Four</h4>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis augue a neque cursus ac blandit orci faucibus. Phasellus nec metus purus.</p>
+
+ <h4>Section Five</h4>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis augue a neque cursus ac blandit orci faucibus. Phasellus nec metus purus.</p>
+
+ <h4>Section Six</h4>
+ <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis augue a neque cursus ac blandit orci faucibus. Phasellus nec metus purus.</p>
+
+ </div>
+ </div>
+
+ <hr>
+ </div>
+ <script type="text/javascript" src="../../intro.js"></script>
+ </body>
+</html>
View
@@ -24,8 +24,10 @@ <h3 class="muted">Examples</h3>
<li><a href="hello-world/index.html" title='Basic usage'>Basic usage</a></li>
<li><a href="hello-world/withoutBullets.html" title='Basic usage with buttons'>Basic usage with buttons</a></li>
<li><a href="hello-world/withoutButtons.html" title='Basic usage with bullets'>Basic usage with bullets</a></li>
+ <li><a href="hello-world/withProgress.html" title='Basic usage with progress-bar'>Basic usage with progress-bar</a></li>
<li><a href="programmatic/index.html" title='Programmatic defining using JSON'>Programmatic defining using JSON</a></li>
<li><a href="multi-page/index.html" title='Multi-Page introduction'>Multi-Page introduction</a></li>
+ <li><a href="auto-position/index.html" title='Auto-positioning'>Auto-positioning</a></li>
<li><a href="RTL/index.html" title='RTL version'>RTL version</a></li>
<li><a href="html-tooltip/index.html" title='HTML in tooltip'>HTML in tooltip</a></li>
<li><a href="custom-class/index.html" title='Custom CSS Class'>Custom CSS Class</a></li>
View
@@ -22,7 +22,7 @@
.introjs-fixParent {
z-index: auto !important;
opacity: 1.0 !important;
- position: absolute;
+ position: absolute !important;
-webkit-transform: none !important;
-moz-transform: none !important;
-ms-transform: none !important;
Oops, something went wrong.

0 comments on commit ea54663

Please sign in to comment.