光标移动的太快，菜单就出有关问题了。如何解决啊 _JavaScript

光标移动的太快，菜单就出问题了。。怎么解决啊？
关键是这句话self = oli[i];m=1;
要执行到n>=1后才赋值；
怎么让它只要鼠标移动新的li就赋值。

HTML code


<!doctype html>

<html> 
<head> 
<meta charset="utf-8" />
    <style type="text/css">
        #myCanvas{ border:1px solid #ccc;}
        *{margin:0;padding:0;}
        ul{ margin-left:500px;list-style:none }
        li{ position:relative;width:100px;line-height:25px;border:1px solid #ccc }
        .popDiv{ position:absolute;top:0px;left:100px;width:100px;height:50px;background:orange;color:#fff;display:none;opacity:0; }
    </style>
    
</head> 
<body> 
<div id="box">mybox</div>

<ul id="list">
    <li>
        <a href="" title="iphone_ios">苹果</a>
        <div class="popDiv">
            
        </div>
    </li>
    <li>
        <a href="" title="安卓_java">google</a>
        <div class="popDiv">
            
        </div>
    </li>
    <li>
        <a href="" title="wp">微软</a>
        <div class="popDiv">
            
        </div>
    </li>
    <li>
        <a href="" title="mysql">甲骨文</a>
        <div class="popDiv">
            
        </div>
    </li>
    <li>
        <a href="" title="全球最大的社交网站">facebook</a>
        <div class="popDiv">
            
        </div>
    </li>
</ul>

<canvas id="myCanvas" width="600" height="300">你的浏览器还不支持哦</canvas> 
<script type="text/javascript"> 



    
    var list = document.getElementById("list");
    var oli = list.getElementsByTagName("li");
    var n = 0;
    var m =0;
    var timer = null;
    var ssss = null;
    var flag = true;
    for(var i=0; i<oli.length; i++){
        var li = oli[i];
        
        li.onmouseover = (function(i){

            return function(){
                

                if(n >= 1){
                    oli[i].getElementsByTagName("div")[0].style.display = "block";
                    oli[i].getElementsByTagName("div")[0].style.opacity = "1"; 
                    self = oli[i];
                    m=1;
                    timer && clearTimeout(timer);
                    n=0;
                    
                }else{
                        n = n+0.200011515;
                        oli[i].getElementsByTagName("div")[0].style.display = "block";
                        oli[i].getElementsByTagName("div")[0].style.opacity = n;
                        flag = false;
                        timer = setTimeout(arguments.callee,90);
                        
                    
                }
                
                
                
            }
            
        })(i)
        

        
        li.onmouseout = function(){
            if(m <= 0){
                self.getElementsByTagName("div")[0].style.display = "none";
                self.getElementsByTagName("div")[0].style.opacity = "0"; 
                ssss && clearTimeout(ssss);
            }else{
                m -=0.200011515;
                self.getElementsByTagName("div")[0].style.opacity = m;
                console.log(oli[i])
                ssss = setTimeout(arguments.callee,90);
            }
        }
    }
    

    
    

    
</script> 

</body> 
</html>?

------解决方案--------------------
li.onmouseout = function(){
if(m <= 0){
self.getElementsByTagName("div")[0].style.display = "none";