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