JavaScript實現(xiàn)鼠標滑過處生成氣泡的方法
更新時間：2015年05月16日 09:26:44 作者：休閑生活文化
這篇文章主要介紹了JavaScript實現(xiàn)鼠標滑過處生成氣泡的方法,涉及鼠標事件與頁面樣式的相關操作技巧,需要的朋友可以參考下
本文實例講述了JavaScript實現(xiàn)鼠標滑過處生成氣泡的方法。分享給大家供大家參考。具體實現(xiàn)方法如下：
<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程序設計有所幫助。
相關文章
js禁止查看源文件屏蔽Ctrl+u/s、F12、右鍵等兼容IE火狐chrome
最近想給JS特效與模板預覽頁面加上屏蔽查看源文件，防治整理不易的源碼被輕易拿走，發(fā)現(xiàn)IE、火狐、chrome等各類瀏覽器支持不一樣。下面是腳本之家整理的一些屏蔽總結2020-10-10
新的一年就要到了，你一定有很多想許下的愿望吧!今天小編就為大家?guī)砹艘粋€基于Html+CSS+JavaScript實現(xiàn)的帶雪花的許愿墻特效，需要的可以了解一下2022-01-01
這篇文章主要介紹了JS設置網頁圖片vspace和hspace屬性的方法,具體分析了vspace和hspace屬性的功能及javascript修改技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-04-04
KnockoutJS 3.X API 第四章之表單submit、enable、disable綁定
Knockout是一個以數據模型（data model）為基礎的能夠幫助你創(chuàng)建富文本，響應顯示和編輯用戶界面的JavaScript類庫。這篇文章介紹了KnockoutJS 3.X API 第四章之表單submit、enable、disable綁定的相關知識，感興趣的朋友一起看看吧2016-10-10
DOM就是Html頁面的模型，將每個標簽都做為一個對象，JavaScript通過調用DOM中的屬性、方法就可以對網頁中的文本框、層等元素進行編程控制。比如通過操作文本框的DOM對象，就可以讀取文本框中的值、設置文本框中的值。2015-07-07
昨天看到谷歌的主頁上出現(xiàn)了幾個動畫，發(fā)現(xiàn)不是flash做的，而是用js+圖片實現(xiàn)的！今天把拷貝到的圖片，用js實現(xiàn)了動畫效果！2013-07-07
JavaScript Event學習第二章 Event瀏覽器兼容性
在這一章我將對重要的事件做一個概述，包括一些流行的瀏覽器的兼容性問題。2010-02-02
這篇文章主要和大家談一談bootstrap響應式布局，本教程講解如何在網頁布局中應用響應式設計，感興趣的小伙伴們可以參考一下2016-05-05
干前端這行當已經超過一個月了, 每天都會遇到新奇古怪, 甚至離奇的問題. 雖然絕大部分都是一些小問題, 但我覺得還是有必要記錄下來2011-05-05
這篇文章主要介紹了JavaScript進制轉換實現(xiàn)方法,結合實例形式分析了JavaScript進制轉換中十進制與其他進制轉換、以及隨機顏色生成相關操作技巧,需要的朋友可以參考下2020-01-01