diff options
| -rw-r--r-- | lib/domUtils.js | 13 | ||||
| -rw-r--r-- | linkHints.js | 17 | ||||
| -rw-r--r-- | vimium.css | 7 |
3 files changed, 26 insertions, 11 deletions
diff --git a/lib/domUtils.js b/lib/domUtils.js index ee17d45f..06bffa42 100644 --- a/lib/domUtils.js +++ b/lib/domUtils.js @@ -106,10 +106,15 @@ var domUtils = { }, // momentarily flash a border around an element to give user some visual feedback - flashElement: function(element) { - var oldBorderValue = element.style.border; - element.style.border = '1px solid #66f'; - setTimeout(function(){element.style.border = oldBorderValue;}, 400); + flashElement: function(element, rect) { + var flashEl = document.createElement("div"); + flashEl.id = "vimiumFlash"; + flashEl.style.left = rect.left + window.scrollX + "px"; + flashEl.style.top = rect.top + window.scrollY + "px"; + flashEl.style.width = rect.width + "px"; + flashEl.style.height = rect.height + "px"; + document.body.appendChild(flashEl); + setTimeout(function() { flashEl.parentNode.removeChild(flashEl); delete flashEl; }, 400); }, }; diff --git a/linkHints.js b/linkHints.js index c729b832..8f91264c 100644 --- a/linkHints.js +++ b/linkHints.js @@ -184,7 +184,7 @@ var linkHints = { if (linksMatched.length == 0) { this.deactivateMode(); } else if (linksMatched.length == 1) { - this.activateLink(linksMatched[0].clickableItem, delay); + this.activateLink(linksMatched[0], delay); } else { for (var i in this.hintMarkers) this.hideMarker(this.hintMarkers[i]); @@ -199,15 +199,16 @@ var linkHints = { */ activateLink: function(matchedLink, delay) { this.delayMode = true; - if (domUtils.isSelectable(matchedLink)) { - domUtils.simulateSelect(matchedLink); + var clickEl = matchedLink.clickableItem; + if (domUtils.isSelectable(clickEl)) { + domUtils.simulateSelect(clickEl); this.deactivateMode(delay, function() { linkHints.delayMode = false; }); } else { // TODO figure out which other input elements should not receive focus - if (matchedLink.nodeName.toLowerCase() === 'input' && matchedLink.type !== 'button') - matchedLink.focus(); - domUtils.flashElement(matchedLink); - this.linkActivator(matchedLink); + if (clickEl.nodeName.toLowerCase() === 'input' && clickEl.type !== 'button') + clickEl.focus(); + domUtils.flashElement(clickEl, matchedLink.rect); + this.linkActivator(clickEl); if (this.shouldOpenWithQueue) { this.deactivateMode(delay, function() { linkHints.delayMode = false; @@ -544,6 +545,8 @@ var hintUtils = { marker.style.left = clientRect.left + window.scrollX + "px"; marker.style.top = clientRect.top + window.scrollY + "px"; + marker.rect = link.rect; + return marker; } }; @@ -380,3 +380,10 @@ body.vimiumFindMode ::selection { border: none !important; width: 90% !important; } + +#vimiumFlash { + box-shadow: 0px 0px 4px 2px #4183C4; + background: transparent; + position: absolute; + z-index: 99999; +} |