tab选项卡切换效果（二）——延迟切换

JS代码如下：

<script>
    function $(id){
return typeof id==='string'?document.getElementById(id):id;  //封装$简化代码
    }
window.onload=function() {
//标签的索引
        var timer = null;
var titles = $('notice_tit').getElementsByTagName('li');
var divs = $('notice_con').getElementsByTagName('div');
if (titles.length != divs.length) return;
//遍历所有的页签
        for (var i = 0; i < titles.length; i++) {
titles[i].id = i;
titles[i].onmouseover = function () {
//用that这个变量来引用当前滑过的li
                var that=this;
//如果存在准备执行的定时器，立刻清除，只有当前停留时间大于500ms时才开始执行
                if (timer){
clearTimeout(timer);
timer=null;
                }
//延迟半秒执行
                timer=setTimeout(function(){
for (var j=0;j<titles.length;j++){
titles[j].className='';
divs[j].style.display='none';
                    }
titles[that.id].className='select';
divs[that.id].style.display='block';
                },500);
            }
        }
    }
</script>