信息技術(shù)教案用FrontPage2000制作動(dòng)態(tài)效果.

1、信息技術(shù)教案：用 FrontPage2000 制作動(dòng)態(tài)效果制作人：陳晴教學(xué)目的：1學(xué)會(huì)制作動(dòng)態(tài)的按紐；2. 學(xué)會(huì)運(yùn)用DHTM特效；3. 初步掌握留言本的制作的方法 ; 教學(xué)重點(diǎn)難點(diǎn)：1. 制作動(dòng)態(tài)的按紐；2. 運(yùn)用 DHTMI特效3. 留言本的制作的方法 教學(xué)方法：師生互動(dòng)，講練結(jié)合。 教學(xué)課時(shí)：二課時(shí) 教學(xué)準(zhǔn)備： 展示制作好的網(wǎng)頁(yè)。教具： 多媒體轉(zhuǎn)播系統(tǒng)、 WOR、DFORNTPAGE 引課 ：如何讓我們的網(wǎng)頁(yè)動(dòng)起來(lái)呢 ?這是我們這節(jié)課要解決的問(wèn)題 .1. 制作動(dòng)態(tài)的按紐。什么是動(dòng)態(tài)按紐？你有沒(méi)有看過(guò)別人的網(wǎng)頁(yè)上有一種按紐， 把鼠標(biāo)移上去的 時(shí)候它就會(huì)變色的的那種，那就是動(dòng)態(tài)按紐了。它在 F

2、rontpage2000 中的做法 也很簡(jiǎn)單。我們點(diǎn)擊菜單欄的“插入一組件一懸停按紐”。接下來(lái)又彈出一個(gè) 窗口, 我們?cè)凇皯彝０醇~屬性”的窗口中設(shè)置一下。 在“按紐文本”中填寫(xiě)想要 在按紐上顯示的文字，還給以給那個(gè)按紐做連接。接下來(lái)你可以設(shè)置按紐顏色 和效果。其中“按紐顏色”指的是這個(gè)按紐在沒(méi)有將鼠標(biāo)移上去的時(shí)候的顏色， 而“效果顏色”就是指鼠標(biāo)移上去的時(shí)候的顏色。我們還可以設(shè)置這個(gè)按紐的 寬度，高度等等。設(shè)置好按確定就行了。這里你先別急著按預(yù)覽按紐， 我們先保存。 因?yàn)橛?Frontpage2000 做的 動(dòng)態(tài)按紐使用到了兩個(gè) Class 文件。我們?cè)诒４嬷髸?huì)發(fā)現(xiàn)保存網(wǎng)頁(yè)的同時(shí)保 存了兩個(gè)

3、以 class 做后綴的文件，記著不要把它們刪了。打開(kāi)你剛剛保存的網(wǎng) 頁(yè)，看一下，是不是很漂亮？2. 為自己的網(wǎng)頁(yè)做一個(gè)簡(jiǎn)易的留言本 : 這樣的話(huà)瀏覽者瀏覽過(guò)你的網(wǎng)頁(yè)之后就 可以給你一些意見(jiàn)和建議了。我們點(diǎn)擊菜單欄的“插入一表單一單行文本框”； 接著你會(huì)看到編輯區(qū)內(nèi)多了虛線(xiàn)方框，里面包括了一個(gè)長(zhǎng)方形的文本框和兩個(gè) 按紐。你肯定填寫(xiě)過(guò)一些網(wǎng)上的表單吧？虛線(xiàn)以?xún)?nèi)的東西就稱(chēng)為表單了。我們 來(lái)設(shè)置一下表單里面的內(nèi)容。先來(lái)設(shè)置長(zhǎng)方形的文本框的屬性，對(duì)長(zhǎng)方形的屬 性框點(diǎn)擊右鍵，選擇“表單域?qū)傩浴?，在彈出的窗口中你可以設(shè)置它的大小。接著依次設(shè)定兩個(gè)按紐的文字。 最后我們?cè)賮?lái)設(shè)置整個(gè)表單的屬性。 在表單內(nèi)，

4、即是虛線(xiàn)內(nèi)點(diǎn)擊鼠標(biāo)右鍵， 選擇表單屬性。接著彈出一個(gè)窗口 . 在表單屬性中我 們只要把“結(jié)果保存到”選擇為“發(fā)送到其他的對(duì)象”（如圖8）。然后再點(diǎn)擊左下角的“選項(xiàng)”按紐，在彈出的窗口中（如圖 9）中，在“動(dòng)作”拉模中 填寫(xiě)上“ mailto: 你的郵箱地址”就行了。 象圖 9那樣填寫(xiě)，只不過(guò)是把郵箱地 址改成你的。三做DHTM峙效。什么是DHTM我們不需要知道，學(xué)會(huì)制作就行了：我們先 要打開(kāi)DHTM效果窗，我們點(diǎn)擊菜單欄的“格式一動(dòng)態(tài) HTML效果”，彈出 DHTM效果窗。制作DHTM特效也很簡(jiǎn)單，只要把要使用到的文字或者圖片括 起來(lái)，使它被選。然后在DHTM效果窗中“開(kāi)啟”一種事件，并且選擇

5、“應(yīng)用” 哪種效果，最后再選擇效果的實(shí)現(xiàn)方法（一）.使用 DHTML 的基本步驟 1.在頁(yè)面點(diǎn)選需要使用 DHTML 的對(duì)象， 比如文本，圖片。對(duì)于文本需要拖曳鼠標(biāo)選定； 2.在 DHTML 工具欄，選擇通 過(guò)開(kāi)啟的下拉列表選擇一種事件，文本和圖片所具有的事件是不同的；接下來(lái) 再應(yīng)用下拉列表選擇一種效果；最后選擇該效果的的實(shí)現(xiàn)方法；3.當(dāng)你為對(duì)象使用了 DHTML 后，保存該頁(yè)面并預(yù)覽，你會(huì)發(fā)現(xiàn)你選定的對(duì)象按照你設(shè)置的 DHTML 的效果出現(xiàn)； 4.如果想刪除某一個(gè)對(duì)象的 DHTML 效果，先選定該對(duì) 象，然后單擊 DHTML 工具欄上的刪除效果圖標(biāo)即可。（二） . DHTML的事件在 DHT

6、ML 制作中，我們聽(tīng)得最多的是 “事件”這個(gè)術(shù)語(yǔ)。什么是 “事件”呢，顧 名思義，就是發(fā)生的一件事情，比如你用手打開(kāi)門(mén)，那么這就是一個(gè)事件。換 到網(wǎng)頁(yè)制作中，開(kāi)門(mén)變成了單擊，也就是說(shuō)，訪(fǎng)問(wèn)者單擊了一個(gè)鏈接，那么出 現(xiàn)了事件的結(jié)果，門(mén)被打開(kāi)了。在FrontPage2000中，當(dāng)我們打開(kāi)DHTML效果工具欄后，點(diǎn)選文本或者 圖片會(huì)產(chǎn)生不同事件。但它們的施用方法是一樣的，下面我們以文本舉例：我 們先在編輯器里輸入一段文本，比如：網(wǎng)頁(yè)陶吧，然后繼續(xù)下面的三個(gè)步驟：選定一段需要產(chǎn)生 DHTML 效果的文本，這里是：網(wǎng)頁(yè)陶吧。從 DHTML 效果工具欄的開(kāi)啟下拉列表選擇一個(gè)事件。這里對(duì)于文本我們只有 “網(wǎng)

7、頁(yè)加載 ” 這個(gè)事件。 “網(wǎng)頁(yè)加載 ”就是當(dāng)網(wǎng)頁(yè)第一次裝入的時(shí)侯發(fā)生的事件，它不需要用 戶(hù)利用鼠標(biāo)去觸發(fā)它，而只需要訪(fǎng)問(wèn)者利用瀏覽器打開(kāi)它的時(shí)侯就會(huì)產(chǎn)生預(yù)設(shè) 的動(dòng)態(tài)效果。應(yīng)用：選擇好事件后，我們要在應(yīng)用下拉列表里選擇一個(gè)該事件 的應(yīng)用效果。在該列表下有七種可以采用的效果，我們選擇飛入。方法：對(duì)于應(yīng)用效果會(huì)有不同的方法產(chǎn)生。 比如當(dāng)你選擇的應(yīng)用效果是 “飛 入”的時(shí)侯，文本可以從底部飛入，可以從左邊飛入，也可以從右邊飛入，這些 就是方法。在這個(gè)下拉列表里并沒(méi)有注明這個(gè)術(shù)語(yǔ)。有的應(yīng)用效果是沒(méi)有方法 的，比如波動(dòng)。我們這里選擇從底部飛入。最后保存該頁(yè)面并預(yù)覽，你會(huì)發(fā)現(xiàn)網(wǎng)頁(yè)陶吧這個(gè)四個(gè)字在網(wǎng)頁(yè)第一次加

8、載 后從底部飛入。當(dāng)然，你也可以嘗試其它 DHTML 效果。對(duì)于選定圖片，你會(huì) 在 DHTML 效果工具欄的開(kāi)啟下拉列表看到新的事件，單擊和鼠標(biāo)懸停，它們 會(huì)有各自的應(yīng)用效果和實(shí)現(xiàn)方法。你可以每一個(gè)嘗試一下，這樣你就能明白這 些事件和應(yīng)用效果和方法之間的關(guān)系。（三）.DHTML 的小技巧 DHTML兼容性利用FrontPage2000制作的DHTML 網(wǎng)頁(yè)只能被InternetExplorer4.0或以上版本完全正常瀏覽。對(duì)于圖片的DHTML 效果， Netscape Communicator 4.0或以上版本也可以瀏覽。禁止 DHTML 如果想禁用 DHTML 效果，點(diǎn)選菜單工具 /網(wǎng)頁(yè)選項(xiàng)

9、，在打開(kāi) 的對(duì)話(huà)框里選擇兼容性標(biāo)簽，取消動(dòng)態(tài) HTML 前的復(fù)選框里勾，這樣 DHTM 效果被禁用?？焖偈褂?DHTML 一般情況，在你沒(méi)有選定某一個(gè)對(duì)象的情況下，你只需 要把鼠標(biāo)移動(dòng)到對(duì)象的左邊或者右邊單擊一下就可以使用 DHTML 效果了。（ 四） .網(wǎng)頁(yè)過(guò)渡 ：網(wǎng)頁(yè)過(guò)渡是指當(dāng)你進(jìn)入或者離開(kāi)一個(gè)網(wǎng)頁(yè)的時(shí)侯所產(chǎn)生的效 果的這個(gè)過(guò)程。 比如你從某一頁(yè)進(jìn)入另一頁(yè)， 你會(huì)發(fā)現(xiàn)當(dāng)前頁(yè)慢慢向中間合攏， 同時(shí)出現(xiàn)了另一個(gè)新的頁(yè)面，直到當(dāng)前頁(yè)合攏消失而最后出現(xiàn)新的頁(yè)面。如果 你想使用網(wǎng)頁(yè)過(guò)渡，可以按照以下步驟：1. 打開(kāi)想使用過(guò)渡效果的頁(yè)面， 或者新建立一個(gè)頁(yè)面。 點(diǎn)選菜單格式 /網(wǎng)頁(yè)過(guò)渡， 打開(kāi)網(wǎng)頁(yè)過(guò)渡

10、對(duì)話(huà)框；2. 在事件下拉列表里選擇一個(gè)事件，我們選擇進(jìn)入網(wǎng)頁(yè)。大家要注意，當(dāng)你為某頁(yè)和站點(diǎn)都設(shè)置了過(guò)渡效果時(shí)，網(wǎng)頁(yè)將比站點(diǎn)過(guò)渡效果優(yōu)先；3.在周期文本框里輸入持續(xù)的時(shí)間，然后在過(guò)渡效果列表框里點(diǎn)選一個(gè)效果，單擊確定。利 用瀏覽器打開(kāi)該頁(yè)面，因?yàn)槲覀冞x擇的網(wǎng)頁(yè)過(guò)渡是進(jìn)入網(wǎng)頁(yè)，所以當(dāng)你打開(kāi)該 頁(yè)時(shí)你就能看到過(guò)渡效果了。利用 DHTML 效果的確是吸引訪(fǎng)問(wèn)者的有力利器，但如果你不愿意和復(fù)雜的代碼打交道，那么FrontPage2000為你預(yù)設(shè)了許多DHTML的效果。你要做 的僅僅是選定需要?jiǎng)討B(tài)效果的對(duì)象，比如文字，圖片，然后利用 “傻瓜”式的操 作就可以讓你的網(wǎng)頁(yè)動(dòng)起來(lái)。我們來(lái)試一下吧。新建一個(gè)網(wǎng)頁(yè)，在編輯區(qū)打上“歡迎，歡迎，熱烈歡迎！ ”，然后用鼠標(biāo)把它括起來(lái)。這是你會(huì)看見(jiàn)DHTM效果窗就會(huì)自動(dòng)啟動(dòng)了。我們?yōu)樗x擇一種事件， 我們選擇“網(wǎng)頁(yè)加載”， 接著在“應(yīng)用”欄中選擇“飛 入”，在“選擇設(shè)置”中選擇“從右側(cè)”。效果就做好了，很容易吧？預(yù)覽一下，你是不是看到“歡迎，歡迎，熱 烈歡迎！”從屏幕的右邊飛到了左邊？這樣就是說(shuō)特效做成功了：當(dāng)然你可以 選擇其它事件的，你喜歡怎么樣就選擇你喜歡的吧。填寫(xiě)完之后這個(gè)表單就做好了，