JSFiddle - React, Tailwind, and code Playground

by lchau

HTML

<b>Firefox 10 <code>onmouseover</code> flicker</b> (unlike <code>display</code>, this only blinks twice)
<div id="tooltip">Mouse over<br/> <code>style:visibility</code></div>

CSS

body { font: 12px Arial; }
div#tooltip {
  background-color: #505050;
  color: white;
  padding: 20px;
  margin: 20px;
  text-align: center;
}

JavaScript

(function() {
  var element = document.getElementById("tooltip");
  element.onmouseover = function() {
    element.style.visibility = 'hidden';
    var timer = setTimeout(function() {
      element.style.visibility = '';
    }, 250);
  }       
})();