老师请您帮忙检查一下代码，谢谢

首页课程实战体系课手记专栏慕课教程

老师请您帮忙检查一下代码，谢谢

来源：6-2 无缝连续滚动特效

慕粉1924517932

2021-12-08 20:15:31

问题描述：

老师我想问一下为什么我这个没有任何效果呢，希望你可以帮忙给检查一下

相关代码：

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    *{
      margin: 0px;
      padding: 0px;
    }
    .box{
      width:840px;
      height:130px;
      border:1px solid #000;
      margin:0 auto;
    }
    .box ul{
      width:5000px;
      list-style: none;
    }
    .box ul li{
      float: left;
      margin-right:10px;
    }
  </style>
</head>
<body>
   <div class="box"id="box">
      <ul id=list>
        <li><img src="image/jiudian.jpg"width="200px"height="130px"></li>
        <li><img src="image/hudie.jpg"width="200px"height="130px"></li>
        <li><img src="image/qingkong .jpg"width="200px"height="130px"></li>
        <li><img src="image/wangzixuan1.jpg"width="200px"height="130px"></li>
        <li><img src="image/huoshaoyun.jpg"width="200px"height="130px"></li>
      </ul>
   </div> 
</body>
<script>
   box=document.getElementById('box');
   list=document.getElementById('list');
   var list;
   var left=0;
   //先来克隆一下
   list.innerHTML+=list.innerHTML;
   //定义函数之前先来调用一下函数
   var timer;
   move();
   //使用函数进行封装
   function move(){
      //设表之前先关闭表
      clearInterval(timer);
      timer=setInterval(function(){
       left-=4;
       if(left<=-1050){
         left=0;
       }
       list.style.left=left+'px';
     },20);
     
    }
   //鼠标计入则可以停止画面
   box.onmouseenter=function(){
      clearInterval(timer);
   }
   //鼠标离开继续执行
   box.onmouseleave=function(){
     move();
   };
</script>
</html>

写回答

1回答