javascript动画之圆形运动,环绕鼠标运动作小球


Posted in Javascript onJuly 20, 2010

代码如下:

<script type="text/javascript"> 
var ball; 
var mouseX = 100; 
var mouseY = 100; 
var angle = 0; 
var radius = 50; function run(){ 
if(ball === undefined){ 
ball = document.createElement("span"); 
ball.style.position = "absolute"; 
ball.style.color = "#FF0000"; 
ball.style.zIndex = 999999999; 
ball.innerHTML = "●"; 
document.body.appendChild(ball); 
} 
ball.style["left"] = mouseX+(Math.cos(angle)*radius) + "px"; 
ball.style["top"] = mouseY+(Math.sin(angle)*radius) + "px"; 
angle+=0.1; 
} 
function MousePos(e) 
{ 
e = e || window.event; 
var x,y; 
if(!document.all){ 
x = e.pageX; 
y = e.pageY; 
} 
else{ 
x = event.clientX + document.documentElement.scrollLeft; 
y = event.clientY + document.documentElement.scrollTop; 
} 
return {x:x,y:y}; 
} 
function setXY(e) 
{ 
e = e || window.event; 
var pos = MousePos(e); 
mouseX = pos.x; 
mouseY = pos.y; 
} 
window.onload = function(){ 
setInterval(run,20); 
document.documentElement.onmousemove = function(e){ 
e = e || window.event; 
setXY(e); 
}; 
} 
</script>

作者: cnblogs airy
Javascript 相关文章推荐
JavaScript 学习笔记(十一)
Jan 19 Javascript
JQuery自适应IFrame高度(支持嵌套 兼容IE,ff,safafi,chrome)
Mar 28 Javascript
jQuery实现网页抖动的菜单抖动效果
Aug 07 Javascript
深入解读JavaScript中的Hoisting机制
Aug 12 Javascript
jQuery实现可用于博客的动态滑动菜单完整实例
Sep 17 Javascript
JS实现漂亮的时间选择框效果
Aug 20 Javascript
JS实现简单的二元方程计算器功能示例
Jan 03 Javascript
关于vue单文件中引用路径的处理方法
Jan 08 Javascript
vue-resource请求实现http登录拦截或者路由拦截的方法
Jul 11 Javascript
React router动态加载组件之适配器模式的应用详解
Sep 12 Javascript
关于vue2强制刷新,解决页面不会重新渲染的问题
Oct 29 Javascript
javascript之Object.assign()的痛点分析
Mar 03 Javascript
根据出生日期自动取得星座的js代码
Jul 20 #Javascript
firefox火狐浏览器与与ie兼容的2个问题总结
Jul 20 #Javascript
Javascript实现CheckBox的全选与取消全选的代码
Jul 20 #Javascript
js下写一个事件队列操作函数
Jul 19 #Javascript
js+css在交互上的应用
Jul 18 #Javascript
基于jQuery试卷自动排版系统
Jul 18 #Javascript
Date对象格式化函数代码
Jul 17 #Javascript
You might like
Protoss兵种对照表
2020/03/14 星际争霸
PHP 数组教程 定义数组
2009/10/23 PHP
基于php使用memcache存储session的详解
2013/06/25 PHP
PHP伪静态Rewrite设置之APACHE篇
2014/07/30 PHP
PHP采用自定义函数实现遍历目录下所有文件的方法
2014/08/19 PHP
PHP开发框架laravel安装与配置教程
2015/03/13 PHP
JavaScript Event学习第十一章 按键的检测
2010/02/10 Javascript
JS实现div内部的文字或图片自动循环滚动代码
2013/04/19 Javascript
javascript贪吃蛇完整版(源码)
2013/12/09 Javascript
jquery实现增加删除行的方法
2015/02/03 Javascript
JavaScript生成随机字符串的方法
2015/03/19 Javascript
javascript实现保留两位小数的多种方法
2015/12/18 Javascript
javascript的几种写法总结
2016/09/30 Javascript
Angular 输入框实现自定义验证功能
2017/02/19 Javascript
js时间戳与日期格式之间转换详解
2017/12/11 Javascript
jQuery内容选择器与表单选择器实例分析
2019/06/28 jQuery
[15:28]DOTA2 HEROS教学视频教你分分钟做大人-剧毒术士
2014/06/13 DOTA
python实现博客文章爬虫示例
2014/02/26 Python
Python的Flask框架中Flask-Admin库的简单入门指引
2015/04/07 Python
python中urllib.unquote乱码的原因与解决方法
2017/04/24 Python
Python解析并读取PDF文件内容的方法
2018/05/08 Python
Python最小二乘法矩阵
2019/01/02 Python
python设计微型小说网站(基于Django+Bootstrap框架)
2019/07/08 Python
Python时间序列缺失值的处理方法(日期缺失填充)
2019/08/11 Python
python生成requirements.txt的两种方法
2019/09/18 Python
Python综合应用名片管理系统案例详解
2020/01/03 Python
使用SimpleITK读取和保存NIfTI/DICOM文件实例
2020/07/01 Python
python实现取余操作的简单实例
2020/08/16 Python
Python在后台自动解压各种压缩文件的实现方法
2020/11/10 Python
swtich是否能作用在byte上,是否能作用在long上,是否能作用在String上
2013/07/06 面试题
护理自我鉴定范文
2013/10/06 职场文书
个人简历自我鉴定
2013/10/11 职场文书
科长竞争上岗演讲稿
2014/05/12 职场文书
贫困证明书格式及范文
2014/10/15 职场文书
《王国之心》迎来了发售的20周年, 野村哲发布贺图
2022/04/11 其他游戏