畢業(yè)設(shè)計(jì)-基于html5和css30的手機(jī)網(wǎng)站的設(shè)計(jì)與實(shí)現(xiàn)-資料下載頁
2024-12-01 19:13本頁面
【導(dǎo)讀】獨(dú)立進(jìn)行研究取得的成果。除文中已經(jīng)注明引用的內(nèi)容外，對本文的研究做出重要貢獻(xiàn)的個(gè)人和集體，均已在文中。以明確方式標(biāo)明。本人承擔(dān)本聲明的相應(yīng)責(zé)任。隨著智能手機(jī)的普及，越來越多同學(xué)使用手機(jī)上網(wǎng)。本研究基于已有的學(xué)院。體瀏覽等特點(diǎn)，較好的滿足了同學(xué)使用手機(jī)瀏覽學(xué)院網(wǎng)站信息的需求。能夠匹配不同的設(shè)備，實(shí)現(xiàn)跨平臺(tái)的瀏覽。用HTML5和技術(shù)具有前瞻性和重大的意義。頁的代碼則是調(diào)用已有網(wǎng)站的代碼，實(shí)現(xiàn)了軟件的可重用性。通過設(shè)計(jì)，旨在學(xué)。下面將從功能需求、環(huán)境需求、用戶界面需求三個(gè)方面詳細(xì)地進(jìn)行系統(tǒng)需求
【正文】 } 實(shí)現(xiàn)頁面的交互和檢測不同的設(shè)備 實(shí)現(xiàn)頁面的交互 由于 jQuery 庫的功能強(qiáng)大并且好多自帶的函數(shù)使用起來十分方便，所以決定采用調(diào)用 jQuery 的方式實(shí)現(xiàn)網(wǎng)頁交互部分的制作，調(diào)用 jQuery 的 JavaScript部分代碼如下： $(function(){ $(navbtn).click(function(){ $(nav).toggle()。 })。 $(goTopBtn).click(function(){ $(39。body,html39。).animate({scrollTop:0},500)。 })。 (gotoBack).onclick=function() { ()。 return false。 } $(.more).click(function(){ $(this).hide()。 $(this).next().toggle()。 })。 })。 實(shí)現(xiàn)檢測不同的設(shè)備 由于許多同學(xué)還會(huì)使用電腦瀏覽學(xué)院的網(wǎng)站，本設(shè)計(jì)采取了兼容的方式，保留了原學(xué)院網(wǎng)站，通過使用 JavaScript 和正則表達(dá)式來進(jìn)行設(shè)備匹配，從而決定用戶是否跳轉(zhuǎn)到手機(jī)版網(wǎng)站。設(shè)備匹配的 JavaScript 代碼如下： script 聊城大學(xué)本科畢業(yè)論文（設(shè)計(jì)） 14 if(((/(iPhone|iPod|Android|ios|iOS|iPad|Backerry| WebOS|Symbian|Windows Phone|Phone)/i))) { (phone/)。 } /script 第 4章 網(wǎng)站的測試與維護(hù) 網(wǎng)站的測試 本設(shè)計(jì)采用 IIS 服務(wù)器和局域網(wǎng)進(jìn)行測試，需將站點(diǎn)文件夾復(fù)制到根目錄下，然后設(shè)置 IP 地址為全部未分配，為了保證手機(jī)的連接到網(wǎng)站，需要把防火墻關(guān)閉。（設(shè)置如圖 1圖 13 所示） 圖 13 IIS 配置 聊城大學(xué)本科畢業(yè)論文（設(shè)計(jì)） 15 圖 14 防火墻設(shè)置 網(wǎng)站的維護(hù) 由于該網(wǎng)站是調(diào)用已有學(xué)院網(wǎng)站動(dòng)態(tài)的 的代碼，并且該網(wǎng)站 使用的是已有的數(shù)據(jù)庫，所以該網(wǎng)站可以和已有的學(xué)院網(wǎng)站一起維護(hù)，設(shè)置一個(gè)管理員即可，既節(jié)約了維護(hù)成本，又保證了該網(wǎng)站的長期有效的運(yùn)行。 聊城大學(xué)本科畢業(yè)論文（設(shè)計(jì)） 16 結(jié)束語 基于 智能手機(jī)顯示的網(wǎng)站 實(shí)現(xiàn)是一項(xiàng)較為復(fù)雜而繁瑣的工作，它設(shè)計(jì)到很多細(xì)節(jié)和技術(shù)。本 設(shè)計(jì) 以 HTML5 和 技術(shù) 為基礎(chǔ)，立足于 廣大同學(xué)用智能手機(jī)瀏覽學(xué)院網(wǎng)站的需要 ，設(shè)計(jì)了 手機(jī)版的學(xué)院網(wǎng)站 。 作者首先對 HTML5 和 技術(shù) 進(jìn)行介紹，然后對 手機(jī)網(wǎng)站 的需求進(jìn)行分析，并在需求分析的基礎(chǔ)上給出了 網(wǎng)站 的 設(shè)計(jì) 總體架構(gòu)；在前面工作的基礎(chǔ)上，詳細(xì)敘述了 手機(jī)網(wǎng)站 主要 布局 的實(shí)現(xiàn) 過程和關(guān)鍵技術(shù)。該 設(shè)計(jì) 可以有效地解決 學(xué)生利用手機(jī)瀏覽學(xué)院網(wǎng)站字跡不清、顯示不全 等問題，真正 實(shí)現(xiàn)學(xué)生的移動(dòng)上網(wǎng)學(xué)習(xí) 。 該 網(wǎng)站 不可避免的存在一定的不足，需要進(jìn)行不斷的修正和完善： （ 1） 網(wǎng)站顏色使用的是純色，使網(wǎng)站頁面并不是那么美觀 。 （ 2） CSS 代碼的不夠精煉、使用 第三方的庫使加載速度減慢 。 （ 3） 由于 測試的瀏覽器不多 ，網(wǎng)站的瀏覽器兼容性 可能 不足。 聊城大學(xué)本科畢業(yè)論文（設(shè)計(jì)） 17 參考文獻(xiàn) [1]布拉德福 ,海涅 ,高京 . 深入理解 HTML： 語義 、 標(biāo)準(zhǔn)與樣式 [M]. 電子工業(yè)出版社， . [2]劉欣 ,王雨竹 . HTML5 入門經(jīng)典 [M]. 機(jī)械 工業(yè)出版社， 2021. [3]庫波 ,汪曉青 . HTML5 與 CSS3 網(wǎng)頁設(shè)計(jì) [M]. 北京理工大學(xué)出版社， . [4]Brad Dayley. jQuery 與 JavaScript 入門經(jīng)典 [M]. 人民郵電出版社 ,. [5] W3School. HTML 系 列 教 程 [EB/OL]. 聊城大學(xué)本科畢業(yè)論文（設(shè)計(jì)） 1 致謝 本畢業(yè)設(shè)計(jì)能夠順利完成，離不開 于連民 老師的悉心指導(dǎo)，本課題從選題到設(shè)計(jì)和最后的撰寫， 他 都給予悉心的指導(dǎo)和幫助 。 同時(shí)， 畢業(yè)設(shè)計(jì)在實(shí)驗(yàn)室制作時(shí)，許多老師都給了許多合理的建議和指導(dǎo)，讓這個(gè)設(shè)計(jì)更加的完善，也讓我從中受益匪淺，感謝這些老師 ！ 此外，感謝聊城大學(xué)曾經(jīng)教過、幫助過和關(guān)心過我的所有老師；感謝傳媒技術(shù)學(xué)院所有的領(lǐng)導(dǎo)、老師及全體同學(xué)的支持、關(guān) 心和幫助！
公司管理相關(guān)推薦
鄂ICP備17016276號-1