基于Flash的超文本鏈接技術設計及其實現(xiàn)

鄭鳳婷，田素貞

(1.河南師范大學，河南 新鄉(xiāng) 453007;2.商丘職業(yè)技術學院，河南 商丘 476000)

1.超文本及超鏈接技術

1.1 超文本

超文本又叫超媒體技術，是建立各種媒體信息之間的網(wǎng)狀鏈接結(jié)構(gòu)，與傳統(tǒng)的線性文本結(jié)構(gòu)有很大差別，它符合人類的“聯(lián)想”式思維習慣。超文本以節(jié)點為信息單位，一個結(jié)點就是一個信息塊，它可以是文本、圖形、圖像、動畫、聲音或它們的組合體，結(jié)點之間用鏈連接起來，這樣便形成網(wǎng)狀結(jié)構(gòu)，是一種非線性的結(jié)構(gòu)。［1］其特征主要體現(xiàn)在三個方面:

1.1.1 多媒體化

作為超文本的基本信息單元——節(jié)點，它可以包含文本、圖形、圖像、音頻、視頻和動畫等多種媒體信息，而且節(jié)點的信息表現(xiàn)方式、大小都可根據(jù)主題自由選擇、組合，不需要嚴格的定義。

1.1.2 網(wǎng)絡結(jié)構(gòu)

超文本是一種網(wǎng)狀的信息結(jié)構(gòu)體，這使它的信息表達接近現(xiàn)實世界。它把內(nèi)容和形式都做為豐富的節(jié)點，按照它們在現(xiàn)實世界中的聯(lián)系和人們的思維邏輯，有機的組織起來，構(gòu)成有條理的、復雜的信息體。

1.1.3 交互性

多媒體和網(wǎng)絡化是超文本靜態(tài)組織信息的特點，而交互性是用戶在瀏覽超級文本時，最為重要的動態(tài)特征。

1.2 超鏈接

超鏈接是www技術的核心，是網(wǎng)頁中最重要、最根本的元素之一。超鏈接能夠使多個孤立的網(wǎng)頁之間產(chǎn)生相互聯(lián)系，從而使單獨的網(wǎng)頁形成一個有機的整體。

所謂超鏈接是指從一個網(wǎng)頁指向一個目標的連接關系，這個目標可以是另一個網(wǎng)頁，也可以是相同網(wǎng)頁上的不同位置，還可以是一個圖片、一個電子郵件地址、一個文件，甚至是一個應用程序［2］。而在一個網(wǎng)頁中用來超鏈接的對象，可以是一段文本或是一個圖片。當瀏覽者單擊已經(jīng)鏈接的文字或圖片后，鏈接目標將顯示在瀏覽器上，并且根據(jù)目標的類型來打開或運行。

(1)按鏈接路徑的不同，超鏈接一般分為三種類型:內(nèi)部鏈接、錨點鏈接和外部鏈接。

(2)按照使用對象的不同，可以劃分為:文本超鏈接、圖像超鏈接、E-mail鏈接、錨點鏈接、多媒體文件鏈接、空鏈接等［3］。

2.函數(shù)及功能描述

Flash中可以利用getURL()的方式來設置超鏈接，或是與網(wǎng)頁中的程序代碼溝通，甚至可以將Flash中的數(shù)據(jù)傳送到指定頁面當中。目前，在網(wǎng)頁中使用Flash，最常遇到的問題就是Flash動畫與Html頁面的互動［4］。例如在Flash中加入網(wǎng)頁的超鏈接、郵件超鏈、甚至調(diào)用Html中所設置的JavaScript特效等動作。以下介紹幾個經(jīng)常使用的方法，說明網(wǎng)頁中的超鏈接的應用［5］。

2.1 getURL函數(shù)

將指定URL的文件加載到窗口中，或是將變量傳遞到位于所定義URL的另一應用程序中。getURL()函數(shù)的基本語法如下:

getURL(URL［，窗口］［，方法］);

函數(shù)參數(shù)說明

(1)URL:取得文件的 URL網(wǎng)址，如【http://www.baidu.com】。

(2)窗口:這是一個可選項，用來指定要加載文件的窗口或HTML頁面框架?？梢暂斎胩囟ù翱诘拿Q，或是從下列保留的目標名稱中選擇。

_self:指定目前窗口中的頁面框架

_blank:指定新的窗口

_parent:指定目前頁面框架的父窗口

_top:指定目前窗口中最上層的頁面框架

(3)方法:用來傳送變量的GET或POST方法。如果沒有變量，則省略該參數(shù)。GET方法會將變量附加到URL網(wǎng)址的后方，適用于數(shù)目較少的變量。POST方法會用不同的HTTP文件頭來傳送變量，并用來傳送較長串的變量。

2.2 常用的鏈接

2.2.1 網(wǎng)頁超鏈接

網(wǎng)頁超鏈接的方法一般為:getURL(“http://www.baidu.com”，“_blank”);此鏈接會打開一個新窗口，顯示【http://www.baidu.com】百度頁面。

2.2.2 郵件超鏈接

郵件超鏈接的格式為:getURL(“mailto:指定電子郵件［?subject=標題］”);此鏈接會打開本機郵件軟件，并將指定電子郵件填入收件人及標題內(nèi)容(可省略)，你只需填寫信內(nèi)容即可寄出。

2.2.3 文本超級鏈接

能在選擇文字的同時打開相關瀏覽器窗口。在［屬性］面板上輸入網(wǎng)址及選擇打開瀏覽器窗口的方式即可。

2.2.4 鏈接外部圖片

能夠打開鏈接相關的圖片。這也是Flash在播放過程中進行鏈接的一個重要方面。其語法為:LoadMovie(“圖片名”，影片剪輯名);

2.2.5 鏈接外部動畫

在Flash頁面打開鏈接的相關動畫。其語法為:LoadMovieNum(“動畫名”，層名this);

3.模塊設計與相關實現(xiàn)

3.1 給按鈕添加超鏈接

方法一:在Flash文件ActionScript 3.0中的實現(xiàn)方法:

(1)打開Flash，選擇［文件］菜單下的［新建］命令，新建一個文件;

(2)在［窗口］菜單中選擇［公用庫］，再在［公用庫］中選擇［按鈕］，選擇其中一種按鈕類型，在舞臺上即出現(xiàn)所選的按鈕圖形;

(3)修改按鈕上的文字為“按鈕超鏈接”;

(4)選擇該按鈕，在［屬性］面板中設置實例名稱為“MyBtn”;

(5)在時間軸面板中，鎖定圖層1，新建圖層2，雙擊該圖層命名為“action”;

(6)選中“action”層的第1幀，按 F9鍵，打開［動作-幀］面板，向其中添加代碼:

MyBtn:addEventListener(MouseEvent.CLICK，onMyBtnclick);

function onMyBtnclick(e:MouseEvent):void{

navigateToURL(new URLRequest(“http://www.baidu.com”)，“_blank”);

}

代碼說明:

①MyBtn:addEventListener(事件類型，處理事件的方法):為名為“MyBtn”的對象添加事件。

［事件類型］有很多種，在此介紹以下幾種鼠標事件:

MouseEvent.click:鼠標單擊事件;

MouseEvent.Mouse_Down:鼠標左鍵按下事件;

MouseEvent.Mouse_Up:鼠標左鍵彈起事件;

MouseEvent.Roll_Over:鼠標滑入事件;

MouseEvent.Roll_Out:鼠標滑出事件;

MouseEvent.Mouse_Move:鼠標移動事件;

MouseEvent.Mouse_Out:鼠標移出事件;

MouseEvent.Mouse_Over:鼠標移過事件;

MouseEvent.Mouse_LEAVE:鼠標移開舞臺事件;

MouseEvent.Mouse_WHEEL:鼠標滾輪滾動事件;

MouseEvent.DOUBLE_click:鼠標雙擊事件;

當使用鼠標雙擊事件時，doubleclickEnabled(雙擊是否可用)必須為True。如MyBtn:doubleclick-Enabled=“True”［6］。

［事件處理方法］為處理事件的一些代碼集合。如方法:

OnMyBtnClick:function OnMyBtnClick(e:MouseEvent):void{

鼠標處理相關事項

}

② navigateToURL(new URLRequest(鏈接地址)，窗口類型):打開或替換一個窗口。

［鏈接地址］為指定要導航到哪個URL;

［窗口類型］可以使用_self、_blank、_parent或_top。

(7)制作完畢，Ctrl+Enter組合鍵測試。單擊按鈕即可在新的窗口中打開鏈接的網(wǎng)頁http://baidu.com。

方法二:在Flash文件ActionScript 2.0中的實現(xiàn)方法:

(1)打開Flash，選擇［文件］菜單下的［新建］命令，新建一個文件;

(2)設圖層為“背景”層，選擇一圖片作為背景;

(3)新建一圖層，修改名為“按鈕超鏈接”;

(4)在［窗口］菜單中選擇［公用庫］，再在［公用庫］中選擇［按鈕］，選擇其中一種按鈕類型，在舞臺上即出現(xiàn)所選的按鈕圖形;

(5)修改按鈕上的文字為“按鈕超鏈接”;

(6)選中該按鈕，按F9鍵，打開［動作-按鈕］面板，向其中添加代碼:

on(release){

getURL(“http://www.baidu.com”，“_blank”);

}

(7)Ctrl+Enter組合鍵測試。單擊按鈕即可在新的窗口中打開鏈接的網(wǎng)頁。

3.2 添加郵件超鏈接

(1)新建一圖層，修改名為“郵件超鏈接”;

(2)制作一郵件超鏈接按鈕，選中該按鈕，按F9鍵，打開［動作-按鈕］面板，向其中添加代碼如下:

on(release){

getURL(“mailto:zczft2005@126.com?subject=我要找鄭鳳婷!”);

}

(3)Ctrl+Enter組合鍵測試。單擊按鈕可打開outlook express郵件鏈接，如下圖1所示:

其中，［zczft2005@126.com］自動填入收件人欄;［我要找鄭鳳婷!］填入標題欄;只需在在下面書寫郵件的內(nèi)容，點發(fā)送即可。

3.3 給文本添加超鏈接

(1)新建一圖層，雙擊修改名為“文本超鏈接”;

(2)在工具欄上選擇“文本工具”，在合適位置拖放鼠標，并輸入文字“文本超鏈接”;

(3)選中“文本超鏈接”，在打開的［屬性］面板中，點“選項”前的三角符號，在展開的“鏈接”項后面輸入網(wǎng)址http://www.htu.edu.cn，在“目標”項后面可以使用_self、_blank、_parent或_top選擇打開瀏覽器窗口的方式;

(4)Ctrl+Enter組合鍵測試。單擊該文本即可打開鏈接的http://www.htu.edu.cn網(wǎng)頁。

圖1 outlook express郵件超鏈接

3.4 超鏈接圖片

(1)新建一圖層，雙擊修改名為“鏈接圖片”;

(2)在該層的第一幀制作一個“超鏈接圖片”按鈕，在該層的第二幀制作一個“返回”按鈕，并拖放到場景中;

(3)制作一個空的影片剪輯，拖到場景中，實例名是:mymc;

(4)在“超鏈接圖片”圖層之上，新建一動作圖層為as，時間軸上第一幀上as的代碼如下:

stop();

i=0;

(5)時間軸上第二幀上as的操作代碼如下:

mymc._x=0;

mymc._y=0;

mymc._xscale=80;

mymc._yscale=82;

其功能是確定打開超鏈接圖片的起始位置和圖片的大小。

(6)在“超鏈接圖片”層的第一幀，選中“鏈接圖片”按鈕，在［動作-按鈕］面板中書寫代碼如下:

on(release){

gotoAndStop(2);

LoadMovie(“j1.jpg”，mymc);

}

(7)在“超鏈接圖片”層的第二幀，選中“返回”按鈕，在打開的［動作-按鈕］面板中編寫代碼如下:

on(release){

UnLoadMovie(mymc);

gotoAndStop(1);

}

(8)Ctrl+Enter組合鍵測試。單擊“鏈接圖片”按鈕即可打開鏈接的圖片“j1.jpg”，單擊左下角的“返回”按鈕即可回到主頁面。

注意事項:

①鏈接的圖片類型除了.jpg類型外，還可以是.bmp、.gif;

②要鏈接的外部圖片必須和正在編輯的Flash文件放在同一目錄下，否則鏈接出錯。

3.5 超鏈接動畫

(1)新建一圖層，雙擊修改名為“鏈接動畫”;

(2)在該層的第一幀制作一個“超鏈接動畫”按鈕，并拖放到場景中;

(3)選中該按鈕，打開［動作-按鈕］面板，并添加代碼如下:

on(release){

LoadMovieNum(“1.swf”，this);

}

(4)Ctrl+Enter組合鍵測試。單擊“鏈接動畫”按鈕，右鍵選擇“允許阻止的內(nèi)容”，出現(xiàn)“安全警告”提示窗口(如下圖2所示)，點擊“是(Y)”，即可打開鏈接的動畫“1.swf”，點擊動畫頁上的“PLAY”即可播放該動畫。

注意:要鏈接的外部動畫必須和正在編輯的Flash文件放在同一目錄下，否則鏈接出錯。

4.結(jié)束語

Flash中超文本鏈接功能非常強大，內(nèi)容比較豐富。本文主要介紹了超文本鏈接技術中常用的getURL函數(shù)的功能及用法，結(jié)合具體實例制作并實現(xiàn)了按鈕超鏈接、郵件超鏈接、文本超鏈接、外部圖片及動畫的超鏈接。內(nèi)容具體、步驟詳盡，希望能給Flash使用者提供一定的學習幫助。

圖2 動畫超鏈接安全警告提示窗口

［1］超文本與超媒體［EB/OL］.http://www3.gdin.edu.cn/jpkc/dmtjs/old/duomeiti/super.htm.

［2］王英芬.超文本/超媒體模式組織網(wǎng)絡信息資源研究［J］.農(nóng)業(yè)圖書情報學刊，2009(12):43 ～45.

［3］邱均平，黃曉斌.WWW網(wǎng)頁的鏈接分析及其意義［J］.中國圖書館學報，2002(6):44～47.

［4］周國棟.Flash與數(shù)據(jù)庫的連接技術［J］.湖南廣播電視大學學報，2005(4):48～50.

［5］鄭華安.超文本鏈接在Authorware課件中的應用［J］.教育信息化，2004，5.

［6］余明華.用 Flash開發(fā)多媒體 CAI課件［J］.大眾科技，2005(5):63～64.