本篇文章給大家談?wù)劇妒謾C(jī)網(wǎng)頁飄雪花》對應(yīng)的知識點(diǎn),希望對各位有所幫助。
本文目錄一覽:
網(wǎng)頁飄雪花的代碼是什么
在后臺添加js特效可實(shí)現(xiàn)這樣的效果。
js代碼為:
script language="JavaScript"
!--
var no = 5; //雪片數(shù)目
var speed = 20; //飄動速度。(值越大越慢)
var ns4up = (document.layers) ? 1 : 0; //當(dāng)前瀏覽器類型,如果是NS則為1
var ie4up = (document.all) ? 1 : 0; //當(dāng)前瀏覽器類型,如果是IE則為1
var s, x, y, sn, cs;
var a, r, cx, cy;
var i, doc_width = 800, doc_height = 600;
x = new Array();
y = new Array();
r = new Array();
cx = new Array();
cy = new Array();
s = 8; //每次下落的高度,越小越平滑,但是也越慢
if (ns4up) { //以NS兼容方式
doc_width = self.innerWidth; //取頁面寬度
doc_height = self.innerHeight; //取頁面高度
}
else
if (ie4up) { //以IE兼容方式
doc_width = document.body.clientWidth; //取頁面寬度
doc_height = document.body.clientHeight; //取頁面高度
}
for (i = 0; i no; ++ i) { //根據(jù)前面定義的雪片數(shù)目寫進(jìn)相應(yīng)數(shù)目的層
initSnow(); //隨機(jī)初始化層的坐標(biāo)
if (ns4up) { //如果瀏覽器是NS
//用layer作為雪片(星號)的容器
document.write("layer name="dot"+ i +"" left="1" ");
document.write("top="1" visibility="show"font color="red"");
document.write("*/font/layer");
}
else
if (ie4up) { //如果瀏覽器是IE
//用div作為雪片的容器
document.write("div id="dot"+ i +"" style="POSITION: ");
document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ");
document.write("visible; TOP: 15px; LEFT: 15px;"font color="red"");
document.write("*/font/div");
}
}
//初始化雪片,生成隨機(jī)坐標(biāo)
function initSnow() {
a = 6;
r[i] = 1;
sn = Math.sin(a);
cs = Math.cos(a);
cx[i] = Math.random() * doc_width + 1;
cy[i] = Math.random() * doc_height + 1;
x[i] = r[i] * sn + cx[i];
y[i] = cy[i];
}
//計算雪花位置,從新位置上出現(xiàn),看起來就像是新產(chǎn)生的一樣。
function makeSnow() {
r[i] = 1;
cx[i] = Math.random() * doc_width + 1;
cy[i] = 1;
x[i] = r[i] * sn + cx[i];
y[i] = r[i] * cs + cy[i];
}
//雪花下落的計算
function updateSnow() {
r[i] += s;
x[i] = r[i] * sn + cx[i];
y[i] = r[i] * cs + cy[i];
}
//在NS瀏覽器上處理雪片下落的主程序
function SnowdropNS() {
for (i = 0; i no; ++ i) { //依次處理每片雪花
updateSnow(); //下落
if ((x[i] = 1) || (x[i] = (doc_width - 20)) || (y[i] = (doc_height - 20))) { //如果超出屏幕范圍
makeSnow(); //則調(diào)整雪片到新位置上
doc_width = self.innerWidth; //更新頁面寬度數(shù)據(jù)
doc_height = self.innerHeight; //更新頁面高度數(shù)據(jù)
}
document.layers["dot"+i].top = y[i]; //改變層的Y坐標(biāo),應(yīng)用新的位置
document.layers["dot"+i].left = x[i]; //改變層的X坐標(biāo),應(yīng)用新的位置
}
setTimeout("SnowdropNS()", speed);
}
//在IE瀏覽器上處理雪片下落的主程序
function SnowdropIE() {
for (i = 0; i no; ++ i) { //依次處理每片雪花
updateSnow(); //下落
if ((x[i] = 1) || (x[i] = (doc_width - 20)) || (y[i] = (doc_height - 20))) { //如果超出屏幕范圍
makeSnow(); //則調(diào)整雪片到新位置上
doc_width = document.body.clientWidth; //更新頁面寬度數(shù)據(jù)
doc_height = document.body.clientHeight; //更新頁面高度數(shù)據(jù)
}
document.all["dot"+i].style.pixelTop = y[i]; //改變層的坐標(biāo),應(yīng)用新的位置
document.all["dot"+i].style.pixelLeft = x[i];
}
setTimeout("SnowdropIE()", speed); //準(zhǔn)備下一次下落過程。
}
if (ns4up) { //如果是NS
SnowdropNS(); //調(diào)用SnowdropNS使雪片下落
}
else
if (ie4up) { //如果是NS
SnowdropIE(); //調(diào)用SnowdropIE使雪片下落
}
--
/script
說明:可以根據(jù)自己的需求根據(jù)說明進(jìn)行相應(yīng)參數(shù)的修改
怎樣在自己的主頁上制造雪花飄的效果
可以通過 首頁上加flash把
wmod參數(shù)設(shè)為 transparent
或者直接用 script實(shí)現(xiàn)
以下是代碼
SCRIPT language=JavaScript1.2
//Configure below to change URL path to the snow image
var speed = 350; // the lower the number the faster the image moves
var snowsrc= new Array();
snowsrc[0] = "images/leave1.gif"
snowsrc[1] = "images/leave2.gif"
// snowsrc[2] = "images/leave2.gif"
// Configure below to change number of snow to render
var no = 6;
var ns4up = (document.layers) ? 1 : 0; // browser sniffer
var ie4up = (document.all) ? 1 : 0;
var dx, xp, yp; // coordinate and position variables
var am, stx, sty; // amplitude and step variables
var i, doc_width = 800, doc_height = 600;
if (ns4up) {
doc_width = self.innerWidth;
doc_height = self.innerHeight;
} else if (ie4up) {
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();
j = 0
for (i = 0; i no; ++i) {
dx[i] = 0; // set coordinate variables
xp[i] = Math.random()*(doc_width-50); // set position variables
yp[i] = Math.random()*doc_height;
am[i] = Math.random()*20; // set amplitude variables
stx[i] = 0.02 + Math.random()/10; // set step variables
sty[i] = 0.7 + Math.random(); // set step variables
if (ns4up) { // set layers
if (i == 0) {
document.write("layer name="dot"+ i +"" left="15" top="15" visibility="show"img src=""+ snowsrc[j] + "" border="0"/layer");
} else {
document.write("layer name="dot"+ i +"" left="15" top="15" visibility="show"img src=""+ snowsrc[j] + "" border="0"/layer");
} } else if (ie4up) { if (i == 0)
{
document.write("div id="dot"+ i +"" style="POSITION: absolute; Z-INDEX: "+ i +"VISIBILITY: visible; TOP: 15px; LEFT: 15px; width:1;"img src="" + snowsrc[j] + "" border="0"/div");
} else {
document.write("div id="dot"+ i +"" style="POSITION: absolute; Z-INDEX: "+ i +"VISIBILITY: visible; TOP: 15px; LEFT: 15px; width:1;"img src="" + snowsrc[j] + "" border="0"/div");
}
}
if (j == (snowsrc.length-1)) { j = 0; } else { j += 1; }
}
function snowNS() { // Netscape main animation function
for (i = 0; i no; ++ i) { // iterate for every dot
yp[i] += sty[i];
if (yp[i] doc_height-50) {
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
doc_width = self.innerWidth;
doc_height = self.innerHeight;
}
dx[i] += stx[i];
document.layers["dot"+i].top = yp[i];
document.layers["dot"+i].left = xp[i] + am[i]*Math.sin(dx[i]);
}
setTimeout("snowNS()", 10);
}
function snowIE() { // IE main animation function
for (i = 0; i no; ++ i) { // iterate for every dot
yp[i] += sty[i];
if (yp[i] doc_height-50) {
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
dx[i] += stx[i];
document.all["dot"+i].style.pixelTop = yp[i];
document.all["dot"+i].style.pixelLeft = xp[i] + am[i]*Math.sin(dx[i]);
}
setTimeout("snowIE()", 10);
}
if (ns4up) {
snowNS();
} else if (ie4up) {
snowIE();
}
/SCRIPT
把 snowsrc[0] = "images/leave1.gif"
snowsrc[1] = "images/leave2.gif"
// snowsrc[2] = "images/leave2.gif"
三個圖片換成你想要的雪花圖片就可以了
QQ空間歡迎動畫地址(要可以使用的)
裝扮空間——自定義——新建模塊
輸入新模塊名字,比如鼠標(biāo),背景等。提交。
然后出現(xiàn)新的對話框,把代碼寫入評論一欄,其他欄清空。提交。
完成后,保存。
1.qq空間皮膚背景代碼:QQ空間不用Q幣更換主頁皮膚方法
下面是更換QQ皮膚的新代碼(2005年11月29日測試可用):
img src="javascript:document.getElementById('Mlogo').style.background='url(http://頂部一條圖片地址)';document.getElementById('all').style.background='url(http://背景圖片地址)';"
如果你不想改頂部圖片條的話只要這樣就夠了:
img src="javascript:document.getElementById('all').style.background='url(http://背景圖片地址)';"
設(shè)置頂部圖片條透明度:
img src="javascript:Mlogo.style.filter='alpha(opacity=30)';"
把30用0-100中喜歡的不透明度代替。100為不透明,0為完全看不見的透明。
我們只要把上面代碼中的兩處“圖片地址”,更改你自己喜歡的皮膚地址,就可以了,同樣代碼都是加到評論里,(提醒:代碼中有兩處地址,都要改, 那些代碼是要放在新建的模塊(當(dāng)然,也可以在你原有的新建模塊里增加一個項(xiàng)目)里的評論里的(自定義-個性模塊--新建模塊-板塊名稱-網(wǎng)頁對話筐-評論-(圖片欄和地址欄的http要刪除) -點(diǎn)個保存方式-保存-關(guān)于做出來得模塊,我們要隱藏它)
那么要怎么樣才知道皮膚的網(wǎng)絡(luò)地址呢?
首先 我們先進(jìn)入:QQ個人空間—裝扮空間-皮膚-看到自己自己喜歡的皮膚點(diǎn)右鍵-屬性-可以看到皮膚地址(請注意那并不是放入皮膚代碼的皮膚網(wǎng)絡(luò)地址)
例如,網(wǎng)絡(luò)位置:
比如上圖-現(xiàn)在:我們右鍵點(diǎn)皮膚小圖片的,屬性,看地址那攔,對照一下和皮膚網(wǎng)絡(luò)位置的地址有什么區(qū)別,嘻嘻~看出來了吧,pre/2/50.gif和orig/2/50.gif不一樣哦,也就是說只要我們把裝扮空間里的皮膚地址里的pre—改為orig
例如: (商場裝扮空間里的皮膚展示的地址)
改為:(實(shí)際的皮膚圖片地址)
注意:由于騰訊QQ空間方面做了限制,通過以上方法得到的皮膚圖片地址如果直接用到代碼里面是無法顯示的。
免費(fèi)的東西難道又沒得用了?有一個方法,如果我們把皮膚圖片文件下載下來,上傳到別的網(wǎng)頁空間再調(diào)出來,是可以顯示的。例如上面這個,上傳到本站,得到地址:,所以,代碼就是:
img src="javascript:document.getElementById('all').style.background='url()';"
你可以用以上方法下載了QQ空間里的圖片文件后上傳到免費(fèi)的網(wǎng)頁空間去(例如論壇、博客等)得到圖片文件的地址。當(dāng)然,你也可以用你在網(wǎng)頁上看到的任何圖片做皮膚,看到喜歡的圖片點(diǎn)右鍵-屬性-地址-復(fù)制,OK,HOHO,喜歡什么皮膚想換就換,很簡單吧~
2.QQ空間代碼之QQ空間導(dǎo)航代碼
什么是QQ空間導(dǎo)航?看右邊這個圖,就是“主頁”、“日志”這些東西,每個人的都一樣,是不是很沒有個性啊?好的,就改改他。先看這個自定義字的導(dǎo)航代碼:
img src="javascript:bt_1.innerText='主 頁';bt_2.innerText='日記簿';bt_3.innerText='音樂廳';bt_4.innerText='留言簿';bt_5.innerText='相冊集';bt_6.innerText='過家家';bt_7.innerText='主人家';bt_8.innerText='誰踩我';"
這代碼里面的中文字可以隨便改,但是不要超過3個中文字,多了就不好看了。
是不是覺得文字的還不過癮,好,下面來看FLASH的。先來看全屏顯示的FLASH的代碼:
img src="javascript:document.getElementById('Mlogo').innerHTML+='div style='position:absolute;top:0;left:0;'EMBED src='地址' quality=high wmode='transparent' WIDTH='925' HEIGHT='655' TYPE='application/x-shockwave-flash'/div';"
這個代碼里“WIDTH='925' HEIGHT='655'”是FLASH的寬度和高度,可根據(jù)FLASH的大小和位置以及在QQ空間出現(xiàn)的地方調(diào)整,“'地址'”就是FLASH導(dǎo)航文件的地址,這個地址去那里找呢?網(wǎng)上有很多,我找了一個做示范,看這個地址:,那么代碼就是:
img src="javascript:document.getElementById('Mlogo').innerHTML+='div style='position:absolute;top:0;left:0;'EMBED src='' quality=high wmode='transparent' WIDTH='925' HEIGHT='655' TYPE='application/x-shockwave-flash'/div';"
上面的這個導(dǎo)航是放在右邊的,如果是放在上面的導(dǎo)航條,例如這個:,那 HEIGHT 選65就可以了,代碼為:
img src="javascript:document.getElementById('Mlogo').innerHTML+='div style='position:absolute;top:0;left:0;'EMBED src='' quality=high wmode='transparent' WIDTH='925' HEIGHT='65' TYPE='application/x-shockwave-flash'/div';"
如果你想將原來的導(dǎo)航條去掉,請看清除導(dǎo)航條代碼:
img src="javascript:bt_1.style.display='none';bt_2.style.display='none';bt_3.style.display='none';bt_4.style.display='none';bt_5.style.display='none';bt_6.style.display='none';bt_7.style.display='none';bt_8.style.display='none';" style="display:none;"
假如有人只想去掉其中一個或多個導(dǎo)航,可以這樣改,舉個例子:比如去掉迷你屋,按順序來排的話迷你屋的序號是6,所以,可以將代碼改成:
img src="javascript:bt_6.style.display='none'" style="display:none;"
如果你想將設(shè)置頂部圖片去掉,騰出空間放導(dǎo)航條,可用請看代碼:
img src="javascript:Mlogo.style.filter='alpha(opacity=0)';"
注意:去掉以后就看不到“自定義”三個字了,如果你想修改QQ空間的話,就朝大概的那個位置點(diǎn)移動鼠標(biāo),看見鼠標(biāo)變成了可以點(diǎn)擊的圖案就可以了。不要告訴我你大概都不在哪里吧?
如果想重新顯示導(dǎo)航條和頂部圖片,將代碼刪除就可以了。
以下是筆者整理出來的QQ空間的部分FLASH導(dǎo)航條,歡迎大家選用:
使用方法:
在空間首頁選擇自定義,再點(diǎn)建立新模塊,然后把代碼寫在“評論”這一欄里,其他的可以全部不填。可以參考里QQ空間皮膚代碼里的使用說明,是一樣的。
3.QQ空間代碼之QQ空間透明Flash背景代碼
先來看全屏顯示的FLASH的代碼:
img src="javascript:document.getElementById('Mlogo').innerHTML+='div style='position:absolute;top:0;left:0;'EMBED src='地址' quality=high wmode='transparent' WIDTH='925' HEIGHT='655' TYPE='application/x-shockwave-flash'/div';"
WIDTH:透明FLASH寬度
HEIGHT:透明FLASH高度
top:透明FLASH與空間頂端的距離
left:透明FLASH與空間左端的距離
以上參數(shù)可根據(jù)FLASH的大小和位置以及在QQ空間出現(xiàn)的地方調(diào)整,不過要想全屏顯示的就話就用上面的參數(shù)就可以了。這個代碼里其實(shí)和QQ空間導(dǎo)航代碼里的是一樣的,只是用途不同,找到合適的FLASH地址就可以了。這個地址去那里找呢?網(wǎng)上有很多,我找了一個做示范,看這個地址:,那么代碼就是:
img src="javascript:document.getElementById('Mlogo').innerHTML+='div style='position:absolute;top:0;left:0;'EMBED src='' quality=high wmode='transparent' WIDTH='925' HEIGHT='655' TYPE='application/x-shockwave-flash'/div';"
以下是筆者整理出來的QQ空間的部分透明FLASH地址,就不介紹了,大家自己看,喜歡就拿去。
性感的唇
蒲公英
螞蟻
藍(lán)色的水
雪花飄
雪花飄
楓葉飄
黑客帝國
心
煙花
漂亮
跟著鼠標(biāo)動的煙火
時間
火
跟著鼠標(biāo)走的魚
眼鏡
下雨了
跟著鼠標(biāo)的白色花
楓葉
使用方法:
在空間首頁選擇自定義,再點(diǎn)建立新模塊,然后把代碼寫在“評論”這一欄里,其他的可以全部不填。可以參考里QQ空間皮膚代碼里的使用說明,是一樣的
空間代碼使用步驟:
1、去掉不要的模塊:
“自定義”--“個性設(shè)置”--“模塊管理”點(diǎn)了之后有一個窗口出來,把不想顯示的模塊前的“√”去掉,然后“提交”,如果你想要原來的默認(rèn)設(shè)置,這個步驟可以省略。
2、新建一個模塊:
“自定義”--“個性設(shè)置”--“新建模塊”點(diǎn)了之后有一個窗口出來,是給模塊起名字的,這個你自己想了,例如“代碼”。起好模塊名字,“提交”后就出另外一個窗口了。
3、填代碼:
在這個新出來的窗口里找到“評論”這個項(xiàng),在里面填入以上代碼。(圖片欄和地址欄的http如果不需要可以刪除)
4、保存!
5、繼續(xù)填加代碼:
如果還有其他代碼填加,增加一個項(xiàng)目就可以了,點(diǎn)擊“+”就可以繼續(xù)添加其他代碼。
6、修改或刪除代碼:
點(diǎn)擊“修改”或“刪除”就可以了。注意:有的代碼添加后再修改會出現(xiàn)無法加入的現(xiàn)象,建議刪除后再添加。
7、隱藏代碼模塊:
添加鼠標(biāo)、掛件、導(dǎo)航的等這些代碼的模塊是不需要顯示的,怎么樣把它隱藏起來呢?有的網(wǎng)友在“模塊管理”里把它去掉了,這樣是看不見了,但是代碼的效果也沒有了。把它隱藏起來有兩個方法。
一個是把它放到邊上去,這樣就看不到了。在“自定義”模式下,用鼠標(biāo)左鍵點(diǎn)這模塊不放,移動鼠標(biāo),把該模塊拖到邊上去。看右圖,這是拖到右邊一半的效果,繼續(xù)往里面移動就可以了。
另一個方法是用其他大的模塊把這個小的模塊遮住,方法同上,移動到大模塊后面去就可以了。
如果隱藏了模塊后想修改又拖拉不出來,可以使用“還原默認(rèn)”恢復(fù),或者刪除這個模塊后再添加。
關(guān)于《手機(jī)網(wǎng)頁飄雪花》的介紹到此就結(jié)束了。