Skip to content

Commit

Permalink
fix issue with position:fixed and hints
Browse files Browse the repository at this point in the history
  • Loading branch information
afshinm committed Dec 20, 2015
1 parent 683975a commit 78496f3
Show file tree
Hide file tree
Showing 2 changed files with 43 additions and 2 deletions.
35 changes: 34 additions & 1 deletion intro.js
Original file line number Diff line number Diff line change
Expand Up @@ -695,6 +695,11 @@
elementPosition = _getOffset(currentElement.element),
widthHeightPadding = 10;

// if the target element is fixed, the tooltip should be fixed as well.
if (_isFixed(currentElement.element)) {
helperLayer.className += ' introjs-fixedTooltip';
}

if (currentElement.position == 'floating') {
widthHeightPadding = 0;
}
Expand Down Expand Up @@ -1067,7 +1072,29 @@
} else {
return propValue;
}
}
};

/**
* Checks to see if target element (or parents) position is fixed or not
*
* @api private
* @method _isFixed
* @param {Object} element
* @returns Boolean
*/
function _isFixed (element) {
var p = element.parentNode;

if (p.nodeName === 'HTML') {
return false;
}

if (_getPropValue(element, 'position') == 'fixed') {
return true;
}

return _isFixed(p);
};

/**
* Provides a cross-browser way to get the screen dimensions
Expand Down Expand Up @@ -1336,6 +1363,12 @@
}(hint, item, i));

hint.className = 'introjs-hint';

// hint's position should be fixed if the target element's position is fixed
if (_isFixed(item.element)) {
hint.className += ' introjs-fixedhint';
}

var hintDot = document.createElement('div');
hintDot.className = 'introjs-hint-dot';
var hintPulse = document.createElement('div');
Expand Down
10 changes: 9 additions & 1 deletion introjs.css
Original file line number Diff line number Diff line change
Expand Up @@ -345,6 +345,10 @@ tr.introjs-showElement > th {
top: 50%;
}

.introjs-fixedTooltip {
position: fixed;
}

.introjs-hint {
position: absolute;
background: transparent;
Expand All @@ -353,7 +357,11 @@ tr.introjs-showElement > th {
}

.introjs-hidehint {
display: none;
display: none;
}

.introjs-fixedhint {
position: fixed;
}

.introjs-hint:hover > .introjs-hint-pulse {
Expand Down

0 comments on commit 78496f3

Please sign in to comment.