JavaScript实现鼠标滑过处生成气泡的方法


Posted in Javascript onMay 16, 2015

本文实例讲述了JavaScript实现鼠标滑过处生成气泡的方法。分享给大家供大家参考。具体实现方法如下:

<HTML>
<HEAD>
<title>鼠标周围在网页上生成气泡</title>
</HEAD>
<BODY bgColor=#000000 scroll=no onload=zyva()>
<div id=aqua style="position:absolute;left=0;top=0;"></div>
<IMG id=B src="b1.gif" style="display:none">
<SCRIPT>
object = new Array()
var xm,ym
function CObj(N,obj){
aqua.insertAdjacentHTML("AfterBegin","<img style='position:absolute;left:-1000;' src='"+obj.src+"'>")
this.img = aqua.firstChild.style
mr = Math.random()
this.v = 6*mr+4
this.s = .5*mr
this.p = .1+mr
this.w = 0
this.k = 0
this.x = xm
this.y = N
this.ChteuMeulEu = function ChteuMeulEu(){
with(this){
with(img){
left = (x+=0.5*v*Math.sin(k+=s))-w*0.5
top = y-=v
width = Math.min(w+=p,100)
}
if(y<-w){
w = 8
y = ym
x = xm
}
}
}
}
function gradient(R,G,B,m){
for(i=0;i<25;i++){
c = 255 - 10 * i
C = "\"RGB("+Math.round(c*R/255)+","+Math.round(c*G/255)+","+Math.round(c*B/255)+")\""
code = "<span style='position:absolute;font-size:1pt;left=0;width=120%;height="+(m)+".2%;top="+(i*m)
+"%;background="+C+";z-Index:-1000'></span>"
document.body.insertAdjacentHTML("beforeEnd",code)
}
}
function zyva(){
xm = document.body.offsetWidth * 0.5
ym = document.body.offsetHeight
document.onmousemove = function (){
xm = window.event.clientX
ym = window.event.clientY
}
for(i=0;i<60;i++)object[i] = new CObj(i,B)
setInterval("for(i in object)object[i].ChteuMeulEu()",16)
gradient(41,93,214,2)
}
</SCRIPT>
</BODY>
</HTML>

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

Javascript 相关文章推荐
关于IE7 IE8弹出窗口顶上
Dec 22 Javascript
分享10篇优秀的jQuery幻灯片制作教程及应用案例
Apr 16 Javascript
《JavaScript高级程序设计》阅读笔记(一) ECMAScript基础
Feb 27 Javascript
javascript弹出层输入框(示例代码)
Dec 11 Javascript
Js为表单动态添加节点内容的方法
Feb 10 Javascript
浅谈JavaScript字符串与数组
Jun 03 Javascript
Node.js程序中的本地文件操作用法小结
Mar 06 Javascript
Jquery组件easyUi实现表单验证示例
Aug 23 Javascript
微信公众号  提示:Unauthorized API function 问题解决方法
Dec 05 Javascript
基本DOM节点操作
Jan 17 Javascript
Bootstrap table表格简单操作
Feb 07 Javascript
JS简单封装的图片无缝滚动效果示例【测试可用】
Mar 22 Javascript
JavaScript中继承用法实例分析
May 16 #Javascript
jQuery实现不断闪烁文字的方法
May 15 #Javascript
javascript实现可拖动变色并关闭层窗口实例
May 15 #Javascript
JavaScript实现简单的数字倒计时
May 15 #Javascript
JavaScript生成福利彩票双色球号码
May 15 #Javascript
JavaScript实现列表分页功能特效
May 15 #Javascript
基于jQuery插件实现环形图标菜单旋转切换特效
May 15 #Javascript
You might like
PHP去除数组中重复的元素并按键名排序函数
2008/08/18 PHP
PHP中echo和print的区别
2014/08/28 PHP
PHP对象克隆clone用法示例
2016/09/28 PHP
基于PHP实现栈数据结构和括号匹配算法示例
2017/08/10 PHP
PHP获取日期对应星期、一周日期、星期开始与结束日期的方法
2018/06/22 PHP
javascript天然的迭代器
2010/10/29 Javascript
写给想学习Javascript的朋友一点学习经验小结
2010/11/23 Javascript
JavaScript设置IFrame高度自适应(兼容各主流浏览器)
2013/06/05 Javascript
改变隐藏的input中value的值代码
2013/12/30 Javascript
简单谈谈jQuery(function(){})与(function(){})(jQuery)
2014/12/19 Javascript
JS与jQuery实现子窗口获取父窗口元素值的方法
2017/04/17 jQuery
Vue中引入样式文件的方法
2017/08/18 Javascript
vue2.0 子组件改变props值,并向父组件传值的方法
2018/03/01 Javascript
JavaScript函数式编程(Functional Programming)高阶函数(Higher order functions)用法分析
2019/05/22 Javascript
Javascript call及apply应用场景及实例
2020/08/26 Javascript
微信小程序实现点赞业务
2021/02/10 Javascript
用生成器来改写直接返回列表的函数方法
2017/05/25 Python
python扫描proxy并获取可用代理ip的实例
2017/08/07 Python
Python递归实现汉诺塔算法示例
2018/03/19 Python
python requests 测试代理ip是否生效
2018/07/25 Python
python实现全盘扫描搜索功能的方法
2019/02/14 Python
python简单实现AES加密和解密
2019/03/28 Python
python,Django实现的淘宝客登录功能示例
2019/06/12 Python
运行Python编写的程序方法实例
2020/10/21 Python
大学生自我评价怎样写好
2013/10/23 职场文书
庆七一活动方案
2014/01/25 职场文书
外语专业毕业生自荐信
2014/04/14 职场文书
爱心活动计划书
2014/04/26 职场文书
活动总结结尾怎么写
2014/08/30 职场文书
英语专业毕业论文答辩开场白
2015/05/27 职场文书
和谐拯救危机观后感
2015/06/15 职场文书
早恋主题班会
2015/08/14 职场文书
家庭教育教师培训学习体会
2016/01/14 职场文书
怎样写好工作计划
2019/04/10 职场文书
2019思想汇报范文
2019/05/21 职场文书
我收到了德劲DE1107
2022/04/05 无线电