JS实现盒子跟着鼠标移动及键盘方向键控制盒子移动效果示例

本文实例讲述了JS实现盒子跟着鼠标移动及键盘方向键控制盒子移动。分享给大家供大家参考，具体如下：

1. 盒子跟着鼠标移动

  
  
  
  
  
  *{
    margin:0;
    padding:0;
  }
    div{
      width: 100px;
      height: 100px;
      background: red;
      position: absolute;
    }
  

2. 键盘方向键控制盒子移动

  
  
    div{
      width:100px;
      height:100px;
      background: red;
      position:absolute;
      left:100px;
      top:100px;
      transition: 0.1s;
    }
  
  

感兴趣的朋友可以使用在线HTML/CSS/Javascript代码运行工具：http://tools.jb51.net/code/HtmlJsRun测试一下运行效果。

更多关于Javascript相关内容感兴趣的读者可查看本站专题：《Javascript页面元素操作技巧总结》、《Javascript操作DOM技巧总结》、《Javascript切换特效与技巧总结》、《Javascript动画特效与技巧汇总》、《Javascript错误与调试技巧总结》、《Javascript数据结构与算法技巧总结》及《Javascript数学运算用法总结》

希望本文所述对大家Javascript程序设计有所帮助。