鼠标放到文字上时,弹出一个方块,移开时自动关闭,怎样实现的?


<html>
  <head>
        <style>
        .tDiv{
            position:absolute;
            border:1px solid black;
            background-color:yellow
        }
    </style>
    <script language=javascript>
    var tDiv; // 提示信息div
        var flag = false; // 是否隐藏提示标志        /**
         * 显示提示信息
         */
    function showTitle(){
      tDiv.innerHTML = '我现在没什么好说的，你要说什么就说吧';
      tDiv.className = 'tDiv';
            tDiv.style.display = '';
            flag = false;
    }        /**
         * 隐藏提示信息
         */
    function hideTitle(){
      if (!flag) {
                tDiv.style.display = 'none';
      }
    }        window.onload = function() {
            tDiv = document.getElementById("myTip");
            tDiv.onmouseover = function() {
                flag = true;
            }
            tDiv.onmouseout = function() {
                this.style.display = "none";
            }
        }
    </script>
  </head>
  
  <body>
    <div onmouseover='showTitle()' onmouseout='setTimeout("hideTitle()",200)'>把鼠标放上来试试（div 实现）</div>
        <div id="myTip"></div>
  </body>
</html>