本發(fā)明涉及互聯(lián)網(wǎng)技術(shù)領(lǐng)域，特別涉及一種智能終端顯示特別效果的方法和系統(tǒng)。

背景技術(shù)：

隨著網(wǎng)絡(luò)的迅速發(fā)展，互聯(lián)網(wǎng)成為大量信息的載體，文字、圖片、數(shù)據(jù)庫、音頻、視頻多媒體等不同類型內(nèi)容大量出現(xiàn)于網(wǎng)絡(luò)，再加以各式各樣的網(wǎng)頁設(shè)計，互聯(lián)網(wǎng)內(nèi)容呈現(xiàn)飛速發(fā)展的趨勢。

在網(wǎng)頁表現(xiàn)方面，HTML5中的CSS3特效樣式、Canvas、webgl的采用，不僅加強了網(wǎng)頁的視覺效果，甚至能夠使用戶在網(wǎng)頁當(dāng)中看到三維立體特效。由于語義上及其ARIA的功能增強，新的HTML標(biāo)簽，如<header>，<footer>，<nav>，<section>，<aside>等等，使得閱讀者更加容易去訪問內(nèi)容。通過HTML5標(biāo)簽<video>和<audio>來訪問視頻和音頻資源，頁面播放媒體的簡便性大大改善。由于<canvas>標(biāo)簽的引入，HTML5的畫圖標(biāo)簽?zāi)軌驅(qū)崿F(xiàn)更多的互動和動畫效果，網(wǎng)頁和用戶之間實現(xiàn)了更好的互動。

在HTML5頁面中，經(jīng)常需要用到在終端頁面呈現(xiàn)隨機灑落雪花、金幣或鮮花的設(shè)計，以動畫效果來烘托氣氛，產(chǎn)生強烈的視覺沖擊力，可以給瀏覽者留下深刻的印象，加強用戶的使用體驗?，F(xiàn)有實現(xiàn)隨機灑落雪花的技術(shù)一般包括：

1、使用Flash。采用flash設(shè)計雪花的圖案，通過Flash的動畫功能實現(xiàn)雪花圖案的移動，從而來實現(xiàn)雪花飄落的視覺效果。

2、利用JS實現(xiàn)。通過JS直接產(chǎn)生隨機數(shù)來控制雪花的產(chǎn)生和滑動軌跡，實現(xiàn)雪花飄落的效果。

3、使用插件。利用已有的雪花飄落的插件，如開源的SnowStorm插件可以實現(xiàn)雪花飄落效果。

上述方案，由于需要采用專門的技術(shù)方案來實現(xiàn)雪花飄落，需要在網(wǎng)頁側(cè)增加代碼，增加了智能終端的運算量，也加大了帶寬占用，容易造成CPU發(fā)熱和縮短待機；而且，采用上述技術(shù)會在國內(nèi)單元上添加一層用戶界面，用戶點擊屏幕后，無法觸發(fā)功能界面的功能，不利于智能終端的使用。

技術(shù)實現(xiàn)要素：

本發(fā)明提供一種智能終端顯示特別效果的方法和系統(tǒng)，可以簡化智能終端顯示動畫雪花飄落的方案，減少智能終端的運算量和帶寬占用，在不降低用戶體驗的條件下延長智能終端的待機，而且用戶界面的功能單元可以正常的使用，更方便終端用戶的操作，符合智能終端應(yīng)用多元化發(fā)展的需求。

本發(fā)明的技術(shù)方案提供了一種智能終端顯示特別效果的方法，包括以下步驟：

在智能終端用戶界面設(shè)置Canvas畫布標(biāo)簽；

創(chuàng)建一個Canvas畫布；

在Canvas畫布實現(xiàn)雪花飄落效果。

進(jìn)一步的，Canvas畫布位于用戶界面的最上層。

進(jìn)一步的，Canvas畫布的width和height屬性同需要顯示飄落雪花的區(qū)域大小一致。

進(jìn)一步的，智能終端隨機生成雪花數(shù)量。

進(jìn)一步的，智能終端隨機生成雪花下落路徑。

進(jìn)一步的，智能終端設(shè)置雪花飄落的持續(xù)時間。

進(jìn)一步的，通過DOM的CSS屬性設(shè)置，禁用Canvas畫布的默認(rèn)事件；

點擊用戶界面，Canvas畫布元素?zé)o觸發(fā)事件。

進(jìn)一步的，若Canvas畫布下層的用戶界面有功能單元，則點擊功能單元 則觸發(fā)該功能單元。

本發(fā)明的技術(shù)方案還提供了一種智能終端顯示特別效果的系統(tǒng)，包括Canvas畫布元素、功能單元和其他元素單元，其中，

Canvas畫布元素用于顯示雪花飄落效果；

功能單元位于Canvas畫布下，可以包括不少于一個的功能單元，組成智能終端的功能頁面；

其他元素單元為構(gòu)成用戶界面的其他單元，為非功能單元。

進(jìn)一步的，禁用Canvas畫布元素的默認(rèn)事件。

本發(fā)明技術(shù)方案由于在智能終端網(wǎng)頁設(shè)計中采用了Canvas畫布元素，可以直接使用html5提供的函數(shù)實現(xiàn)動畫雪花飄落的效果，避免了現(xiàn)有顯示雪花動畫實現(xiàn)方案的復(fù)雜方案，壓縮了網(wǎng)頁設(shè)計的代碼編碼數(shù)量，減少智能終端的運算量和帶寬占用，在不降低用戶體驗的條件下延長智能終端的待機，更好滿足智能終端用戶的使用需求，符合智能終端應(yīng)用多元化發(fā)展的需求。

本發(fā)明的其它特征和優(yōu)點將在隨后的說明書中闡述，并且，部分地從說明書中變得顯而易見，或者通過實施本發(fā)明而了解。本發(fā)明的目的和其他優(yōu)點可通過在所寫的說明書、權(quán)利要求書、以及附圖中所特別指出的結(jié)構(gòu)來實現(xiàn)和獲得。

下面通過附圖和實施例，對本發(fā)明的技術(shù)方案做進(jìn)一步的詳細(xì)描述。

附圖說明

附圖用來提供對本發(fā)明的進(jìn)一步理解，并且構(gòu)成說明書的一部分，與本發(fā)明的實施例一起用于解釋本發(fā)明，并不構(gòu)成對本發(fā)明的限制。在附圖中：

圖1為本發(fā)明實施例一中智能終端顯示特別效果的方法流程圖；

圖2為本發(fā)明實施例二中在雪花動畫中點擊功能單元的方法流程圖；

圖3為本發(fā)明實施例一和二中智能終端顯示特別效果的系統(tǒng)結(jié)構(gòu)圖。

具體實施方式

以下結(jié)合附圖對本發(fā)明的優(yōu)選實施例進(jìn)行說明，應(yīng)當(dāng)理解，此處所描述的優(yōu)選實施例僅用于說明和解釋本發(fā)明，并不用于限定本發(fā)明。

圖1為本發(fā)明實施例一中智能終端顯示特別效果的方法流程圖。如圖1所示，該流程包括以下步驟：

步驟101、在智能終端用戶界面設(shè)置Canvas畫布標(biāo)簽。

在用戶界面設(shè)置Canvas畫布標(biāo)簽，為啟動Canvas畫布做準(zhǔn)備。

步驟102、創(chuàng)建一個Canvas畫布。

該Canvas畫布位于用戶界面的最上層，用于覆蓋原有的功能單元。畫布顯示雪花飄落的特效后，將會在屏幕的最上層顯示雪花飄落的動畫圖案，原有的功能頁面將會位于雪花動畫的下層。

步驟103、設(shè)置Canvas畫布的參數(shù)。

設(shè)置Canvas畫布的width和height屬性，同需要顯示飄落雪花的區(qū)域大小一致；

設(shè)置隨機生成雪花數(shù)量，實現(xiàn)雪花布滿顯示屏幕的效果；

隨機生成雪花下落路徑，實現(xiàn)雪花自由下落的顯示效果；

設(shè)置雪花飄落的持續(xù)時間，實現(xiàn)雪花飄落持續(xù)時間的效果。

通過DOM的CSS屬性設(shè)置，禁用Canvas畫布的默認(rèn)事件，點擊用戶界面，Canvas畫布元素?zé)o觸發(fā)事件。

步驟104、在Canvas畫布實現(xiàn)雪花飄落效果。

根據(jù)步驟103所設(shè)置的Canvas畫布參數(shù)，實現(xiàn)雪花布滿屏幕、自由飄落的動畫效果；

點擊用戶界面，不會觸發(fā)Canvas畫布的默認(rèn)事件；

若Canvas畫布下層的用戶界面有功能單元，則點擊功能單元則觸發(fā)該功能單元。

步驟105、Canvas畫布元素功能關(guān)閉。

在Canvas畫布預(yù)先設(shè)定的持續(xù)時間結(jié)束以后，Canvas畫布元素功能自動關(guān)閉，此時原有頁面的功能單元和其他元素單元恢復(fù)原狀態(tài)，成為用戶界面最上面的界面。

圖2為本發(fā)明實施例一中在雪花動畫中點擊功能單元的方法流程圖。如圖1所示，該流程包括以下步驟：

步驟201、在智能終端用戶界面設(shè)置Canvas畫布標(biāo)簽。

在用戶界面設(shè)置Canvas畫布標(biāo)簽，為啟動Canvas畫布做準(zhǔn)備。

步驟202、創(chuàng)建一個Canvas畫布。

該Canvas畫布位于用戶界面的最上層，用于覆蓋原有的功能單元。畫布顯示雪花飄落的特效后，將會在屏幕的最上層顯示雪花飄落的動畫圖案，原有的功能頁面將會位于雪花動畫的下層。

步驟103、設(shè)置Canvas畫布的參數(shù)。

設(shè)置Canvas畫布的width和height屬性，同需要顯示飄落雪花的區(qū)域大小一致；

設(shè)置隨機生成雪花數(shù)量，實現(xiàn)雪花布滿顯示屏幕的效果；

隨機生成雪花下落路徑，實現(xiàn)雪花自由下落的顯示效果；

設(shè)置雪花飄落的持續(xù)時間，實現(xiàn)雪花飄落持續(xù)時間的效果。

通過DOM的CSS屬性設(shè)置，禁用Canvas畫布的默認(rèn)事件，點擊用戶界面，Canvas畫布元素?zé)o觸發(fā)事件。

步驟204、在Canvas畫布實現(xiàn)雪花飄落效果。

根據(jù)步驟203所設(shè)置的Canvas畫布參數(shù)，實現(xiàn)雪花布滿屏幕、自由飄落的動畫效果。

點擊用戶界面，不會觸發(fā)Canvas畫布的默認(rèn)事件。

若Canvas畫布下層的用戶界面有功能單元，則點擊功能單元則觸發(fā)該功 能單元。

步驟205、點擊功能單元。

在Canvas畫布預(yù)先設(shè)定的持續(xù)時間沒有之前，點擊Canvas畫布下層的功能單元。

步驟206、功能單元啟動，Canvas畫布元素功能關(guān)閉。

Canvas畫布元素功能及其下層的功能單元和其他元素單元關(guān)閉，所點擊的功能單元的功能啟動。

為了實現(xiàn)上述智能終端顯示特別效果的流程，本實施例還提供了一種智能終端顯示特別效果的系統(tǒng)，圖3為本發(fā)明實施例一中智能終端顯示特別效果的系統(tǒng)結(jié)構(gòu)圖。如圖3所示，該系統(tǒng)包括Canvas畫布元素301、功能單元302和其他元素單元303，其中，

Canvas畫布元素用于顯示雪花飄落效果，位于用戶界面的最上層；

功能單元位于Canvas畫布下，可以包括不少于一個的功能單元，組成智能終端的功能頁面；

其他元素單元為構(gòu)成用戶界面的其他單元，為非功能單元。

功能單元位和其他元素單元構(gòu)成智能終端的用戶界面的原有內(nèi)容。當(dāng)啟動雪花動畫的特效時，在用戶界面上添加一層Canvas畫布，用戶就會體驗到在屏幕上雪花飄落的顯示效果。

進(jìn)一步的，禁用Canvas畫布元素的默認(rèn)事件，用戶點擊屏幕時，不會吃法Canvas畫布的功能；如果點擊的位置有功能單元，盡管隔著Canvas畫布，但是仍然觸發(fā)該功能單元。

上述實施例中的技術(shù)方案由于在智能終端顯示界面采用了html5的Canvas畫布元素，不必添加附加的顯示方案即可實現(xiàn)雪花全屏飄落的效果，簡化了智能終端的顯示雪花動畫的方案，減少智能終端的運算量和帶寬占用，在不降低用戶體驗的條件下延長智能終端的待機，而且用戶界面的功能單元可以正常的 使用，更方便終端用戶的操作，符合智能終端應(yīng)用多元化發(fā)展的需求。

本領(lǐng)域內(nèi)的技術(shù)人員應(yīng)明白，本發(fā)明的實施例可提供為方法、系統(tǒng)、或計算機程序產(chǎn)品。因此，本發(fā)明可采用完全硬件實施例、完全軟件實施例、或結(jié)合軟件和硬件方面的實施例的形式。而且，本發(fā)明可采用在一個或多個其中包含有計算機可用程序代碼的計算機可用存儲介質(zhì)(包括但不限于磁盤存儲器和光學(xué)存儲器等)上實施的計算機程序產(chǎn)品的形式。

本發(fā)明是參照根據(jù)本發(fā)明實施例的方法、設(shè)備(系統(tǒng))、和計算機程序產(chǎn)品的流程圖和/或方框圖來描述的。應(yīng)理解可由計算機程序指令實現(xiàn)流程圖和/或方框圖中的每一流程和/或方框、以及流程圖和/或方框圖中的流程和/或方框的結(jié)合。可提供這些計算機程序指令到通用計算機、專用計算機、嵌入式處理機或其他可編程數(shù)據(jù)處理設(shè)備的處理器以產(chǎn)生一個機器，使得通過計算機或其他可編程數(shù)據(jù)處理設(shè)備的處理器執(zhí)行的指令產(chǎn)生用于實現(xiàn)在流程圖一個流程或多個流程和/或方框圖一個方框或多個方框中指定的功能的裝置。

這些計算機程序指令也可存儲在能引導(dǎo)計算機或其他可編程數(shù)據(jù)處理設(shè)備以特定方式工作的計算機可讀存儲器中，使得存儲在該計算機可讀存儲器中的指令產(chǎn)生包括指令裝置的制造品，該指令裝置實現(xiàn)在流程圖一個流程或多個流程和/或方框圖一個方框或多個方框中指定的功能。

這些計算機程序指令也可裝載到計算機或其他可編程數(shù)據(jù)處理設(shè)備上，使得在計算機或其他可編程設(shè)備上執(zhí)行一系列操作步驟以產(chǎn)生計算機實現(xiàn)的處理，從而在計算機或其他可編程設(shè)備上執(zhí)行的指令提供用于實現(xiàn)在流程圖一個流程或多個流程和/或方框圖一個方框或多個方框中指定的功能的步驟。

顯然，本領(lǐng)域的技術(shù)人員可以對本發(fā)明進(jìn)行各種改動和變型而不脫離本發(fā)明的精神和范圍。這樣，倘若本發(fā)明的這些修改和變型屬于本發(fā)明權(quán)利要求及其等同技術(shù)的范圍之內(nèi)，則本發(fā)明也意圖包含這些改動和變型在內(nèi)。