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 相关文章推荐
jquery对表单操作2
Apr 06 Javascript
js通过地址栏给action传值(中文乱码全是问号)
May 02 Javascript
Javascript学习指南
Dec 01 Javascript
Jquery EasyUI Datagrid右键菜单实现方法
Dec 30 Javascript
Bootstrap选项卡学习笔记分享
Feb 13 Javascript
JS正则表达式验证中文字符
May 08 Javascript
基于jquery日历价格、库存等设置插件
Jul 05 jQuery
Vue实现PopupWindow组件详解
Apr 28 Javascript
微信小程序左滑动显示菜单功能的实现
Jun 14 Javascript
Vue实现回到顶部和底部动画效果
Jul 31 Javascript
vue 导航内容设置选中状态样式的例子
Nov 01 Javascript
vue实现简单全选和反选功能
Sep 15 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
异世界新番又来了,同样是从零开始,男主的年龄降到5岁
2020/04/09 日漫
php动态绑定变量的用法
2015/06/16 PHP
建立良好体验度的Web注册系统ajax
2007/07/09 Javascript
jQuery创建平滑的页面滚动(顶部或底部)
2013/02/26 Javascript
JavaScript显示当然日期和时间即年月日星期和时间
2013/10/29 Javascript
Javascript执行效率全面总结
2013/11/04 Javascript
解决JavaScript数字精度丢失问题的方法
2015/12/03 Javascript
Vue form 表单提交+ajax异步请求+分页效果
2017/04/22 Javascript
jQuery实现导航栏头部菜单项点击后变换颜色的方法
2017/07/19 jQuery
用JS实现简单的登录验证功能
2017/07/28 Javascript
JS switch判断 三目运算 while 及 属性操作代码
2017/09/03 Javascript
Angular2之二级路由详解
2018/08/31 Javascript
微信小程序实现顶部下拉菜单栏
2018/11/04 Javascript
js获取form表单中name属性的值
2019/02/27 Javascript
20道JS原理题助你面试一臂之力(必看)
2019/07/22 Javascript
vue实现数字动态翻牌的效果(开箱即用)
2019/12/08 Javascript
javascript实现智能手环时间显示
2020/09/18 Javascript
python中as用法实例分析
2015/04/30 Python
Python模拟登陆淘宝并统计淘宝消费情况的代码实例分享
2016/07/04 Python
教你用Type Hint提高Python程序开发效率
2016/08/08 Python
python 中的int()函数怎么用
2017/10/17 Python
Pandas之groupby( )用法笔记小结
2019/07/23 Python
Python实现的微信红包提醒功能示例
2019/08/22 Python
python去除删除数据中\u0000\u0001等unicode字符串的代码
2020/03/06 Python
Django 实现图片上传和下载功能
2020/12/31 Python
个人自荐书
2013/12/20 职场文书
生物技术专业求职信
2014/06/10 职场文书
个人股份转让协议书范本
2015/01/28 职场文书
幼儿园中班教师个人工作总结
2015/02/06 职场文书
2015廉洁自律个人总结
2015/02/14 职场文书
2015年政协委员工作总结
2015/05/20 职场文书
2015年中学团委工作总结
2015/07/22 职场文书
python实现批量移动文件
2021/04/05 Python
图文详解nginx日志切割的实现
2022/01/18 Servers
【海涛解说】史上最给力比赛,挑战DOTA极限
2022/04/01 DOTA
python数据分析之单因素分析线性拟合及地理编码
2022/06/25 Python