diff --git a/docs/docs/hints/attributes.md b/docs/docs/hints/attributes.md index 7d2afe369..d2819aa7f 100644 --- a/docs/docs/hints/attributes.md +++ b/docs/docs/hints/attributes.md @@ -8,4 +8,4 @@ permalink: /hints/attributes/ You can use these HTML attributes to manage or alter hint elements. - `data-hint`: The tooltip text of hint - - `data-hintPosition`: Optionally define the position of hint. Options: `top-middle`, `top-left`, `top-right`, `bottom-left`, `bottom-right`, `bottom-middle`, `middle-left`, `middle-right`, `middle-middle`. Default: `top-middle` + - `data-hintposition`: Optionally define the position of hint. Options: `top-middle`, `top-left`, `top-right`, `bottom-left`, `bottom-right`, `bottom-middle`, `middle-left`, `middle-right`, `middle-middle`. Default: `top-middle` diff --git a/docs/docs/intro/attributes.md b/docs/docs/intro/attributes.md index f69c35a2c..c555e1ec8 100644 --- a/docs/docs/intro/attributes.md +++ b/docs/docs/intro/attributes.md @@ -9,8 +9,8 @@ You can use these HTML attributes to manage or alter intro elements. - `data-intro`: The tooltip text of step - `data-step`: Optionally define the number (priority) of step - - `data-tooltipClass`: Optionally define a CSS class for tooltip - - `data-highlightClass`: Optionally append a CSS class to the helperLayer + - `data-tooltipclass`: Optionally define a CSS class for tooltip + - `data-highlightclass`: Optionally append a CSS class to the helperLayer - `data-position`: Optionally define the position of tooltip, `top`, `left`, `right`, `bottom`, `bottom-left-aligned` (same as `bottom`), `bottom-middle-aligned`, `bottom-right-aligned` or `auto` (to detect the position of element and assign the correct position automatically). Default is `bottom` - - `data-scrollTo`: Optionally define the element to scroll to, `element` or `tooltip`. Default is `element`. + - `data-scrollto`: Optionally define the element to scroll to, `element` or `tooltip`. Default is `element`. - `data-disable-interaction`: To disable interactions with elements inside the highlighted box, `true` or `false` (also `1` or `0`). diff --git a/example/callbacks/onbeforechange.html b/example/callbacks/onbeforechange.html index 6c349365c..4ee26f9d9 100644 --- a/example/callbacks/onbeforechange.html +++ b/example/callbacks/onbeforechange.html @@ -40,7 +40,7 @@ <h1 data-step="1" data-intro="This is a tooltip!">Usage of onbeforechange</h1> <hr> <div class="row-fluid marketing"> - <div class="span6" data-step="2" data-intro="Ok, wasn't that fun?" data-position='right' data-scrollTo='tooltip'> + <div class="span6" data-step="2" data-intro="Ok, wasn't that fun?" data-position='right' data-scrollto='tooltip'> <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> diff --git a/example/custom-class/index.html b/example/custom-class/index.html index 917b14613..92c4b8ffc 100644 --- a/example/custom-class/index.html +++ b/example/custom-class/index.html @@ -34,7 +34,7 @@ <div class="container-narrow"> <div class="masthead"> - <ul class="nav nav-pills pull-right" data-step="5" data-tooltipClass='forLastStep' data-intro="Get it, use it."> + <ul class="nav nav-pills pull-right" data-step="5" data-tooltipclass='forLastStep' 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> diff --git a/example/disable-interaction/index.html b/example/disable-interaction/index.html index 0c4749187..bb0ce38f9 100644 --- a/example/disable-interaction/index.html +++ b/example/disable-interaction/index.html @@ -41,7 +41,7 @@ <h1 data-step="1" data-intro="Interaction is disabled in this step" data-disable <hr> <div class="row-fluid marketing"> - <div class="span6" data-step="2" data-intro="Ok, wasn't that fun?" data-position='right' data-scrollTo='tooltip'> + <div class="span6" data-step="2" data-intro="Ok, wasn't that fun?" data-position='right' data-scrollto='tooltip'> <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> diff --git a/intro.js b/intro.js index 3c61ef641..c255f7a21 100644 --- a/intro.js +++ b/intro.js @@ -185,10 +185,10 @@ element: currentElement, intro: currentElement.getAttribute('data-intro'), step: parseInt(currentElement.getAttribute('data-step'), 10), - tooltipClass: currentElement.getAttribute('data-tooltipClass'), - highlightClass: currentElement.getAttribute('data-highlightClass'), + tooltipClass: currentElement.getAttribute('data-tooltipclass'), + highlightClass: currentElement.getAttribute('data-highlightclass'), position: currentElement.getAttribute('data-position') || this._options.tooltipPosition, - scrollTo: currentElement.getAttribute('data-scrollTo') || this._options.scrollTo, + scrollTo: currentElement.getAttribute('data-scrollto') || this._options.scrollTo, disableInteraction: disableInteraction }; } @@ -220,10 +220,10 @@ element: currentElement, intro: currentElement.getAttribute('data-intro'), step: nextStep + 1, - tooltipClass: currentElement.getAttribute('data-tooltipClass'), - highlightClass: currentElement.getAttribute('data-highlightClass'), + tooltipClass: currentElement.getAttribute('data-tooltipclass'), + highlightClass: currentElement.getAttribute('data-highlightclass'), position: currentElement.getAttribute('data-position') || this._options.tooltipPosition, - scrollTo: currentElement.getAttribute('data-scrollTo') || this._options.scrollTo, + scrollTo: currentElement.getAttribute('data-scrollto') || this._options.scrollTo, disableInteraction: disableInteraction }; } @@ -1707,7 +1707,7 @@ //first add intro items with data-step _forEach(hints, function (currentElement) { // hint animation - var hintAnimation = currentElement.getAttribute('data-hintAnimation'); + var hintAnimation = currentElement.getAttribute('data-hintanimation'); if (hintAnimation) { hintAnimation = (hintAnimation === 'true'); @@ -1718,9 +1718,9 @@ this._introItems.push({ element: currentElement, hint: currentElement.getAttribute('data-hint'), - hintPosition: currentElement.getAttribute('data-hintPosition') || this._options.hintPosition, + hintPosition: currentElement.getAttribute('data-hintposition') || this._options.hintPosition, hintAnimation: hintAnimation, - tooltipClass: currentElement.getAttribute('data-tooltipClass'), + tooltipClass: currentElement.getAttribute('data-tooltipclass'), position: currentElement.getAttribute('data-position') || this._options.tooltipPosition }); }.bind(this));