为什么鼠标移开的时候 效果没显示

来源:3-1 JS缓冲动画

慕斯卡8315334

2016-08-08 20:00

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Title</title>
   <style>
       #nav{
           width: 200px;
           height: 250px;
           background:  #cccccc;
       }
       #nav-a{
           width: 100px;
           height: 200px;
          background:  #56c;
       }
       li{
           height: 20px;
           width: 20px;
           background: #000000;
           border: 1px solid #ffffff;
       }
       
   </style>

   <script type="text/javascript">
       window.onload=function() {
           var nav = document.getElementById('nav').getElementsByTagName('li');
           for(var i=0;i<nav.length;i++)
           nav[i].onmouseover = function () {
              changea();
          }
          nav[i].onmouseout=function () {
              changeb()
          }
       };

       function changea() {
           var aNav=document.getElementById('nav-a');
           aNav.style.display='none';

       }
       function changeb() {
           var aNav=document.getElementById('nav-a');
           aNav.style.display='block';

       }

   </script>
</head>
<body>

<div id="nav">
   <ul>
       <li></li>
       <li></li>
   </ul>
</div>
<div id="nav-a"></div>
</body>
</html>

写回答 关注

1回答

  • ZhouJT
    2016-08-08 22:44:16

    for循环下少了{}把后面这段包裹起来:

             nav[i].onmouseover = function () {
                  changea();
              }
              nav[i].onmouseout=function () {
                  changeb()
              }

JS动画效果

通过本课程JS动画的学习,从简单动画开始,逐步深入各种动画框架封装

113925 学习 · 1443 问题

查看课程

相似问题