HTML5的發(fā)展越來越邁向成熟,很多的應(yīng)用已經(jīng)逐漸出現(xiàn)在你我日常生活中了,不只讓傳統(tǒng)網(wǎng)站上的互動(dòng)Flash逐漸的被HTML5的技術(shù)取代,更重要的是可以透過HTML5的技術(shù)來開發(fā)跨平臺(tái)的手機(jī)軟件,讓許多開發(fā)者感到十分興奮!查看全文>>
HTML5的標(biāo)簽重新定義,其屬性更加簡(jiǎn)單高效,本地存儲(chǔ)、緩存技術(shù)更加完善,簡(jiǎn)單易用,最重要的是其游戲開發(fā)方面,canvas的繪制,加之以用于開發(fā)3D游戲,更加方便快捷,無需下載,打開瀏覽器就可以玩。對(duì)視頻音頻的支持也更加完美,是web的重大革新。另本文總結(jié)了HTML5帶來的15項(xiàng)你必須知道的新特性(偏基礎(chǔ))。查看全文>>
drawBackground() 函數(shù)在畫布的 (0,0) 繪制背景圖像。稍后,我會(huì)在本文中修改該函數(shù),以便滾動(dòng)背景。而繪制平臺(tái)(它們不是圖像)需要更廣泛地使用 Canvas API。多用途的 drawImage() 方法您可以使用 Canvas 2D 上下文的 drawImage() 方法在畫布內(nèi)的任何地方繪制一個(gè)完整的圖像,或圖像內(nèi)的任何矩形區(qū)域,有選擇地沿著路線縮放圖像。除了圖像外,您還可以利用 drawImage() 繪制另一個(gè)畫布或一個(gè) video 元素當(dāng)前幀的內(nèi)容。這只是其中一個(gè)方法,但 drawImage() 還有助于便利地實(shí)現(xiàn)有趣的或者難以實(shí)現(xiàn)的應(yīng)用程序(如視頻編輯軟件)。查看全文>>
drawRunner函數(shù)中主要是將三個(gè)參數(shù)(一個(gè)圖像、左側(cè)坐標(biāo)和頂部坐標(biāo))向drawImage()傳遞,其中頂部坐標(biāo)由跑步者所駐留的平臺(tái)決定,而左側(cè)坐標(biāo)則是一個(gè)常數(shù)查看全文>>
既然圖形和動(dòng)畫的先決條件已經(jīng)得到滿足,那么現(xiàn)在是時(shí)候讓 Snail Bait 動(dòng)起來了。首先,我在游戲的 HTML 中讓 requestNextAnimationFrame() 包含 JavaScript。startGame() 函數(shù)由背景圖像的 onload 事件處理器調(diào)用,該函數(shù)通過調(diào)用 requestNextAnimationFrame() polyfill 啟動(dòng)游戲。在繪制游戲的第一個(gè)動(dòng)畫幀時(shí),瀏覽器會(huì)調(diào)用 animate() 函數(shù)。查看全文>>
HTML5 中video標(biāo)簽是用來對(duì)視頻文件播放的,而我們的視頻文件大多數(shù)格式的都是以flv后綴或者是mp3和MP4結(jié)尾的。不過有時(shí)候發(fā)現(xiàn)在html網(wǎng)頁(yè)中,一般情況下,MP4或者M(jìn)P3格式的視頻都不能播放。因此,我們巧妙的借助HTML5 的video標(biāo)簽。就可以正常播放MP4的視頻了。查看全文>>