瀏覽器焦點動態(tài)移動方法及系統(tǒng)的制作方法
【技術(shù)領(lǐng)域】
[0001] 本發(fā)明涉及一種瀏覽器控制技術(shù)，尤其涉及一種瀏覽器焦點動態(tài)移動方法及系 統(tǒng)。
【背景技術(shù)】
[0002] 隨著社會的進步和技術(shù)水平的提高，瀏覽器已經(jīng)進入各個領(lǐng)域，包括數(shù)字電視、網(wǎng) 絡(luò)電視（Internet Protocol Television, IPTV)、手機、計算機等電子裝置，而焦點的移動 是瀏覽器中一向最基本的技術(shù)。
[0003] 傳統(tǒng)的焦點移動技術(shù)，是指刷新原來焦點的位置，刷新新焦點的位置，然后在新焦 點的坐標處畫一個框。由此可知，傳統(tǒng)的焦點移動技術(shù)只有兩次繪制焦點框，即未移動前的 一次(原來焦點的位置）和移動到目的地之后的一次(新焦點的位置)，這樣焦點的移動就沒 有動態(tài)的效果，只能看到最后焦點所在位置。
【發(fā)明內(nèi)容】
[0004] 鑒于以上內(nèi)容，有必要提供一種瀏覽器焦點動態(tài)移動方法及系統(tǒng)，其可記錄初始 焦點（舊焦點）的位置和終點焦點（新焦點）的位置，然后在定時器（Timer)中根據(jù)初始焦點 和終點焦點的位置，在初始焦點和終點焦點之間繪制一次或多次焦點框，形成動態(tài)的焦點 移動效果。
[0005] -種瀏覽器焦點動態(tài)移動方法，該方法包括如下步驟：獲取瀏覽器的初始焦點框 的初始坐標信息和終點焦點框的終點坐標信息；當根據(jù)初始坐標信息繪制完初始焦點框 后，每隔固定時間，計算出當前焦點框的當前坐標信息；根據(jù)當前坐標信息繪制當前焦點 框，并將當前焦點框顯示在瀏覽器上；如果當前坐標信息與終點坐標信息一致，則退出繪制 當前焦點框。
[0006] -種瀏覽器焦點動態(tài)移動系統(tǒng)，該系統(tǒng)包括：獲取瀏覽器的初始焦點框的初始坐 標信息和終點焦點框的終點坐標信息的模塊；當根據(jù)初始坐標信息繪制完初始焦點框后， 每隔固定時間，計算出當前焦點框的當前坐標信息的模塊；根據(jù)當前坐標信息繪制當前焦 點框，并將當前焦點框顯示在瀏覽器上的模塊；如果當前坐標信息與終點坐標信息一致，則 退出繪制當前焦點框的模塊。
[0007] 相較于現(xiàn)有技術(shù)，所述的瀏覽器焦點動態(tài)移動方法及系統(tǒng)，可以記錄初始焦點（舊 焦點）的位置和終點焦點（新焦點）的位置，然后在定時器（Timer)中根據(jù)初始焦點和終點焦 點的位置，在初始焦點和終點焦點之間繪制一次或多次焦點框，形成動態(tài)的焦點移動效果， 使用戶看上去焦點是在動態(tài)移動的，更吸引人的眼球。
【附圖說明】
[0008] 圖1是本發(fā)明瀏覽器焦點動態(tài)移動系統(tǒng)的應(yīng)用環(huán)境圖；
[0009] 圖2是本發(fā)明瀏覽器焦點動態(tài)移動方法的具體流程圖；
[0010] 圖3是瀏覽器焦點動態(tài)移動的效果圖。
【具體實施方式】
[0011] 為了使本發(fā)明的描述更易于理解，以下先對【具體實施方式】部分用到的專業(yè)術(shù)語進 行解釋說明。
[0012] 瀏覽器：瀏覽器是指可以顯示網(wǎng)頁服務(wù)器或者文件系統(tǒng)的HTML (Hyper Text Markup Language,超文本標記語言）文件內(nèi)容，并支持用戶與這些文件交互的一種軟件。[0013] 焦點：計算機程序語言中所謂的焦點，就是當前光標被激活的位置，是指哪個控件 被選中，可以被操作。比如一個文本框獲得焦點，用戶在鍵盤上敲進的字符就直接進入了文 本框。還比如一個下拉式列表框獲得焦點，用戶按下鍵盤上的向下箭頭，下拉式列表就會列 出來。在本實施例中，焦點包括真焦點和假焦點。
[0014] 真焦點：指瀏覽器默認能畫出焦點框的節(jié)點，也就是幾個固定的標簽，比如：〈a>、 <input>、<botton>、<area> 等。
[0015] 假焦點：是通過Java腳本（Java script)來設(shè)置圖片的隱藏顯示等技術(shù)來顯示圖 片，達到類似焦點框的效果的節(jié)點。
[0016] 定時器（Timer):本實施中特指根據(jù)固定時間間隔，來多次調(diào)用的一個函數(shù)。
[0017] 坐標信息：本實施中指的是瀏覽器XY坐標系中的焦點距離原點的橫軸方向距離 (X軸坐標)、縱軸方向距離（Y軸坐標)以及焦點框的寬度（Width)和高度（Height)。其中，焦 點框是以焦點為中心的一個方形區(qū)域(如矩形區(qū)域)，所述坐標信息用一個數(shù)組進行存儲。
[0018]Surface:本實施例中是指創(chuàng)建一塊內(nèi)存，用來存儲每次要畫的焦點框數(shù)據(jù)。
[0019] 以下結(jié)合圖1至圖3的描述，具體介紹本發(fā)明。
[0020] 如圖1所示，是本發(fā)明瀏覽器焦點動態(tài)移動系統(tǒng)的應(yīng)用環(huán)境圖。該瀏覽器焦點動 態(tài)移動系統(tǒng)26應(yīng)用于帶有顯示屏幕20和輸入設(shè)備22的電子裝置2中。例如，該電子裝置 2可以是數(shù)字電視、網(wǎng)絡(luò)電視（InternetProtocolTelevision,IPTV)、智能手機、計算機、 PDA(PersonalDigitalAssistant,掌上電腦)等智能設(shè)備。所述顯示屏幕20可以是液晶 顯示屏或0LED顯示屏等顯示裝置，所述輸入設(shè)備22可以是鍵盤、或觸控屏等輸入裝置。
[0021] 所述電子裝置2還包括通過數(shù)據(jù)線或信號線相連的存儲器24和處理器28。需要 說明的是，圖1只是對電子裝置2軟件結(jié)構(gòu)和硬件結(jié)構(gòu)的示意性說明，電子裝置2還包括其 它必要的電子元器件和系統(tǒng)軟件(如瀏覽器等)，在此不再一一贅述。
[0022] 所述瀏覽器焦點動態(tài)移動系統(tǒng)26存儲于電子裝置2的存儲器24中，用于記錄初 始焦點（舊焦點）的位置和終點焦點（新焦點）的位置，然后在定時器（Timer)中根據(jù)初始焦 點和終點焦點的位置，在初始焦點和終點焦點之間繪制一次或多次焦點框，形成動態(tài)的焦 點移動效果，具體方法流程參閱圖2的描述。
[0023] 在本實施例中，所述瀏覽器焦點動態(tài)移動系統(tǒng)26可以提供一個或多個模塊，所述 一個或多個模塊被存儲在所述電子裝置2的存儲器24中并被配置成由一個或多個處理器 (本實施例為一個處理器28)執(zhí)行，以完成本發(fā)明。本發(fā)明所稱的模塊是完成一特定功能的 計算機程序段，比程序更適合于描述軟件在計算機中的執(zhí)行過程。
[0024] 如圖2所示，是本發(fā)明瀏覽器焦點動態(tài)移動方法的具體流程圖。
[0025] 步驟S10,獲取瀏覽器的初始焦點框的初始坐標信息infol (xl，yl，wl，hi)和終點 焦點框的終點坐標信息info2(x2,y2,w2,h2)。在本實施例中，坐標原點為瀏覽器頁面的左 上角位置。其中，初始焦點框是以初始焦點為中心的一個方形區(qū)域(如矩形區(qū)域)，xl代表 初始焦點框距離瀏覽器頁面最左端的距離，yl代表初始焦點框距離瀏覽器頁面最上端的距 離，wl代表初始焦點框的寬度，hi代表初始焦點框的高度。終點焦點框是以終點焦點為中 心的一個方形區(qū)域(如矩形區(qū)域)，x2代表終點焦點框距離瀏覽器頁面最左端的距離，y2代 表終點焦點框距離瀏覽器頁面最上端的距離，代表終點焦點框的寬度，h2代表終點焦點 框的高度。
[0026] 具體而言，通過解析瀏覽器頁面和排版瀏覽器頁面，獲取瀏覽器的初始焦點框的 初始坐標信息infol和終點焦點框的終點坐標信息info2。
[0027] 在本實施例中，解析瀏覽器頁面是指：將瀏覽器頁面的內(nèi)容生成一個相互聯(lián)系的 帶有各標簽屬性的樹狀結(jié)構(gòu)。
[0028] 例如，該樹狀結(jié)構(gòu)可以表示為：
[0029] <html>
[0030] 〈body〉
[0031] 〈divstyle="left: 10px;top: 10px;width: 100px;height:lOOpx" >
[0032] <a></a>
[0033] <input></input)
[0034] <div>
[0035] 〈/body〉
[0036] </html>
[0037] 在上述樹狀結(jié)構(gòu)中，根節(jié)點是<html>，〈body〉是<html>的子節(jié)點，<div>是 〈body〉的字節(jié)點，<div>又有兩個子節(jié)點<a>和〈input〉，<a>和〈input〉是兄弟節(jié)點的關(guān) 系。
[0038] 在本實施例中，排版瀏覽器頁面是指：遍歷上述瀏覽器頁面的樹狀結(jié)構(gòu)，得到每一 個節(jié)點的屬性，從而得到指定節(jié)點的坐標信息（即位置信息)。
[0039] 例如，在上例中，當遍歷到div標簽時，貝U從<div>節(jié)點中獲取該節(jié)點的屬性： style="left: 10px;top: 10p