《WEB游戲網(wǎng)頁制作報告(含源代碼).doc》由會員分享，可在線閱讀，更多相關(guān)《WEB游戲網(wǎng)頁制作報告(含源代碼).doc（13頁珍藏版）》請在裝配圖網(wǎng)上搜索。
1、WEB程序設(shè)計基礎(chǔ) 學(xué) 號：201109XXX班 級：電氣 110X姓 名：張 XXXXX 一、設(shè)計思路設(shè)計目標：設(shè)計一個圖文并茂的游戲介紹網(wǎng)頁。網(wǎng)頁中包括音樂和視頻。設(shè)計思路：本次設(shè)計共有三個網(wǎng)頁，包括主頁，圖文介紹，視頻欣賞。代碼內(nèi)容主要涉及圖片及多媒體的鏈接，文字的對齊方式，超鏈接的設(shè)置，網(wǎng)頁特效的使用。設(shè)計步驟：（1）首頁置頂為滾動文字，用分割線分隔內(nèi)容，菜單是使用javaScript語言編寫的特效代碼，用分割線分隔正文內(nèi)容，圖像分布于正文的左右兩側(cè)，底部加入自動播放的音樂。在寫入內(nèi)容前，先定義網(wǎng)頁的背景顏色及設(shè)定背景圖片，并使之與滾動條對應(yīng)滾動。文本的顏色，字體，鏈接顏色等。然后開始
2、寫入正文內(nèi)容，插入滾動文字作為標題（h1號大小），編寫菜單代碼（此處于網(wǎng)上摘錄一段菜單特效代碼）。寫入文本內(nèi)容，定義文字大小顏色，對齊方式；插入圖片，設(shè)置圖片的位置，設(shè)置圖片鏈接。底下加入滾動文字。最后調(diào)整結(jié)構(gòu)，排版（在文本與菜單之間加入分隔線。）使網(wǎng)頁看起來更加美觀。為增加效果，在頁面進入時，會有網(wǎng)頁展開效果（如從中間展開、向兩邊展開、百葉窗等；此處我設(shè)置了隨機選?。?。另外當雙擊網(wǎng)頁時，可實現(xiàn)自動滾屏功能，方便閱覽。主頁的界面（2）圖文頁代碼編寫與首頁類似，這里網(wǎng)頁背景選用純黑色。依舊是對網(wǎng)頁先進行定義。然后再寫入內(nèi)容。最后排版。圖片加入了顯示特效，正常狀況下為暗色，當鼠標移動到上面時，變成
3、高亮狀態(tài)。網(wǎng)頁后面加入一段自動播放音樂的代碼。為增加效果，在頁面進入時，會有網(wǎng)頁展開效果。另外當雙擊網(wǎng)頁時，可實現(xiàn)自動滾屏功能，方便閱覽。圖文頁面的上半部分，包括標題返回鏈接，特效圖像。下半部分，包括文字內(nèi)容及音樂。（3）視頻頁這個頁面的定義代碼與圖文頁一樣。不同的是，在最頂上加入固定標題，然后是一段自動播放的視頻。取消了音樂播放。下面的代碼和圖文頁一樣。不作說明。網(wǎng)頁上半部分，包括標題和視頻。下半部分，圖像文字介紹。二、網(wǎng)頁界面首頁圖文頁視頻頁三、網(wǎng)頁源代碼首頁代碼 網(wǎng)頁制作 一花一世界，一葉一菩提functionattachXMenu(objid)var tds=objid.getElem
4、entsByTagName(td);for(var i=0;itds.length;i+)with(tdsi)onmouseover=function()with(this)filters0.apply();style.background=#ec7272; /這是鼠標移上去時的背景顏色style.border=1px solid #e29e61; /邊框style.color=#ffffff; /文字顏色filters0.play();onmouseout=function()with(this)filters0.apply();style.background=#4740a7; /這是鼠標
5、離開時的背景顏色style.border=1px solid #554bde; /邊框style.color=#bebaf3; /文字顏色filters0.play();絮 語 聽 音首 頁奇 幻 炫 影 attachXMenu(xmenu0); 流 年 剪 影 山圍暮城一線天，雨落幻夢萬念生。 黑巖山頂，王華站在一塊黑色的巖石上，表情木然地抽了口煙，白色輕緲的煙霧緩緩從鼻腔噴出，消散無形，這是煙的一生。他覺得白色的煙霧好像帶走了什么，可仔細一想?yún)s什么也沒有帶走。 王華看著徐徐下落的夕陽，映照著腳下的城市。離那座壓抑的城市遠了，他覺得自己好像脫離了這個世界，一種被拋棄的孤獨與無助席卷全身。 本
6、資料片背景主要敘述隨著黑暗之門的打開，為了阻止燃燒軍團的遠征毀滅艾澤拉斯，戰(zhàn)火已再度燃起，艾澤拉斯的英雄已經(jīng)很少考慮諾森德大陸這片冰凍荒原，但古老的邪惡勢力正在那里等待。已毀于戰(zhàn)火的艾卓尼布魯王朝中蟄伏的邪靈和它們邪惡的統(tǒng)治者卻并未遺忘艾澤拉斯。版權(quán)所有，翻版收費 圖文頁代碼 網(wǎng)頁制作 天樓沙海風(fēng)畫壁，冥城九幽鬼打墻。返 回 首 頁 var currentpos,timer; function initialize() timer=setInterval(scrollwindow(),16); function sc() clearInterval(timer); function scrol
7、lwindow() currentpos=document.body.scrollTop; window.scroll(0,+currentpos); if (currentpos != document.body.scrollTop) sc(); document.onmousedown=sc document.ondblclick=initialize !- function high(which2) theobject=which2 highlighting=setInterval(highlightit(theobject),50) function low(which2) clear
8、Interval(highlighting) which2.filters.alpha.opacity=40 function highlightit(cur2) if (cur2.filters.alpha.opacity100) cur2.filters.alpha.opacity+=10 else if (window.highlighting) clearInterval(highlighting) 云霧飄渺，如煙霧般飄蕩著，隨著一陣清風(fēng)徐徐而來，給山頂帶來了幾分濕潤的氣息。霧過云飄，露出光禿禿的山頂。山頂正中，一個身材高大的胖子坐在地上，嘴里還咀嚼著什么，“哎，我這最后一根雞腿也吃了
9、，那家伙怎么還不來，這不是故意吊我的胃口，想吃他一頓大餐還真是不容易。上天??！為什么不讓他是一個女人，如果是那樣，我就算拼了老命也要娶她為妻，讓她天天來安慰我的胃?！币贿呎f著，胖子用沾滿油膩的大手揉了揉自己的肚子，臉上充滿了哀嘆之色，只不過，哀嘆之色出現(xiàn)在他這張胖大的臉上。 “胖子，你又在白日做夢了。你以為，這次我還打不過你么？只要我勝了，你就必須還我鳳女?！钡统恋穆曇羧缤瑏碜跃庞囊话恪?七點絢麗的光芒飄然而至，叮的一聲輕響，以北斗七星之勢同時落在胖子身前，那是七柄刀，但卻只有刀柄露在外面，每一柄刀的末端，都鑲嵌著一顆形狀不同、顏色不同的璀璨寶石。藍、紅、青、黃、銀、白、黑七種顏色交映生輝，頓
10、時使山頂上覆蓋了一層氤氳寶光。金發(fā)青年人眼中流露出癡迷的光芒，“冰雪女神的嘆息晨露。”嗡的一聲輕響，藍光驟然湛放，山頂上的水元素明顯強盛起來。 “火焰之神的咆哮正陽刀?！奔t光亮。 “自由之風(fēng)的輕吟傲天刀。”青光亮。 “大地蘇醒的旋律長生刀。”黃光亮。 “神機百變的六芒璇璣刀?！便y光亮。 “貫通天地的曙光圣耀刀。”白光亮。 “永世地獄的詛咒噬魔刀?！焙诠饬?。 七色光芒驟然湛放，交織成如同彩虹一般的絢麗色彩。金發(fā)青年人面露笑容，看著那七色光芒，道：“它們，是七大神刃，也是凝聚著冰、火、風(fēng)、土、空間、光明、黑暗七種元素的魔法杖，最重要的，它們都是我的菜刀。” 七色光芒包裹住年輕人的身體，以先前那紅、
11、藍兩個六芒星為引，形成了一層怪異的全系結(jié)界，年輕人眼中流露出一絲怪異的笑容，向胖子道：“讓你試試我新研究出的特技魔法全系；影之傀儡?！?air版權(quán)所有，翻版收費視頻頁代碼 網(wǎng)頁制作 GAME VIEW星際爭霸，蟲族之心返 回 首 頁 var currentpos,timer; function initialize() timer=setInterval(scrollwindow(),16); function sc() clearInterval(timer); function scrollwindow() currentpos=document.body.scrollTop; windo
12、w.scroll(0,+currentpos); if (currentpos != document.body.scrollTop) sc(); document.onmousedown=sc document.ondblclick=initialize !- function high(which2) theobject=which2 highlighting=setInterval(highlightit(theobject),50) function low(which2) clearInterval(highlighting) which2.filters.alpha.opacity
13、=40 function highlightit(cur2) if (cur2.filters.alpha.opacity100) cur2.filters.alpha.opacity+=10 else if (window.highlighting) clearInterval(highlighting) 游戲故事發(fā)生在Sanctuary，一個黑暗的魔幻世界。這個世界里的大多數(shù)居民不知道的是，二十多年前曾經(jīng)涌現(xiàn)出一批英勇強大的英雄，從地下世界邪惡勢力的手中拯救了Sanctuary世界。很多曾經(jīng)直接面對地獄之師的勇士們，即便從戰(zhàn)爭中幸存下來，也都已經(jīng)神智錯亂。而其他大部分戰(zhàn)士則選擇埋葬這一段可怕的記憶，讓思緒從恐懼中解脫。版權(quán)所有，翻版收費
WEB游戲網(wǎng)頁制作報告(含源代碼).doc
