如何用dreamweaver制作網(wǎng)站下拉菜單效果

本篇內(nèi)容主要講解“如何用dreamweaver制作網(wǎng)站下拉菜單效果”,感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷,實用性強。下面就讓小編來帶大家學(xué)習(xí)“如何用dreamweaver制作網(wǎng)站下拉菜單效果”吧!

創(chuàng)新互聯(lián)專注于企業(yè)營銷型網(wǎng)站建設(shè)、網(wǎng)站重做改版、合川網(wǎng)站定制設(shè)計、自適應(yīng)品牌網(wǎng)站建設(shè)、H5場景定制、商城網(wǎng)站制作、集團公司官網(wǎng)建設(shè)、外貿(mào)網(wǎng)站建設(shè)、高端網(wǎng)站制作、響應(yīng)式網(wǎng)頁設(shè)計等建站業(yè)務(wù),價格優(yōu)惠性價比高,為合川等各大城市提供網(wǎng)站開發(fā)制作服務(wù)。

打開軟件,我們按快捷鍵ctrl+n,建立一個新的文件。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

點擊常用,選擇布局。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

點擊繪制層。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

鼠標(biāo)拖動,可以建立一個層。層的寬度是389,高度是49.

如何用dreamweaver制作網(wǎng)站下拉菜單效果

我們再點擊層,再繪制一個。我們看到,第一個層是layer1,第二個是layer2,這都是系統(tǒng)默認(rèn)的。

如何用dreamweaver制作網(wǎng)站下拉菜單效果 如何用dreamweaver制作網(wǎng)站下拉菜單效果

通過界面下方屬性欄,設(shè)置layer2的屬性。益處設(shè)置為hidden,他的意思是,如果這個層裝不下文字,就隱藏文字。

如何用dreamweaver制作網(wǎng)站下拉菜單效果 如何用dreamweaver制作網(wǎng)站下拉菜單效果

將光標(biāo)放在layer1,然后點擊插入表格。建立一個一行三列,寬388的表格。

如何用dreamweaver制作網(wǎng)站下拉菜單效果 如何用dreamweaver制作網(wǎng)站下拉菜單效果

在表格內(nèi)輸入百度經(jīng)驗,百度知道,百度文庫,然后在屬性欄設(shè)置如下屬性。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

選中l(wèi)ayer1,然后設(shè)置layer1的屬性。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

在layer2中輸入經(jīng)驗首頁,個人中心,小測首頁,幫幫首頁。然后設(shè)置如下屬性。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

我們調(diào)處時間軸:點擊窗口——時間軸。

如何用dreamweaver制作網(wǎng)站下拉菜單效果 如何用dreamweaver制作網(wǎng)站下拉菜單效果

需阿澤layer2,右鍵單擊圖中所示,然后選擇添加對象。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

鼠標(biāo)將時間針定位在第一幀,然后設(shè)置layer2的高度為0。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

之后我們再在時間軸上右鍵單擊,選擇添加時間軸。

如何用dreamweaver制作網(wǎng)站下拉菜單效果 如何用dreamweaver制作網(wǎng)站下拉菜單效果

右鍵單擊,選擇添加對象。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

將時間針定位在第十五幀,然后讓layer2的高度為0.

如何用dreamweaver制作網(wǎng)站下拉菜單效果

以上步驟就添加了兩個時間軸timeline1和timeline2.接著,我們選中“百度經(jīng)驗”這個表格,在右側(cè)的標(biāo)簽對話框,選擇行為,點擊“+”。

如何用dreamweaver制作網(wǎng)站下拉菜單效果 如何用dreamweaver制作網(wǎng)站下拉菜單效果

選擇時間軸,播放時間軸。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

彈出這個對話框,我們選擇timeline1,點擊確定。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

接著在標(biāo)簽欄設(shè)置鼠標(biāo)動作為onmouseover,意思是鼠標(biāo)移動到上面就執(zhí)行時間軸1,就會展開layer2.

如何用dreamweaver制作網(wǎng)站下拉菜單效果

同樣的方法,我們添加如下動作,下圖有各個動作的解釋。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

我們按快捷鍵F12,來到了瀏覽器,看看這是一開始的效果。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

接著把鼠標(biāo)移動到百度經(jīng)驗,展開了下拉菜單。你學(xué)會了嗎。

如何用dreamweaver制作網(wǎng)站下拉菜單效果

到此,相信大家對“如何用dreamweaver制作網(wǎng)站下拉菜單效果”有了更深的了解,不妨來實際操作一番吧!這里是創(chuàng)新互聯(lián)網(wǎng)站,更多相關(guān)內(nèi)容可以進入相關(guān)頻道進行查詢,關(guān)注我們,繼續(xù)學(xué)習(xí)!

新聞標(biāo)題:如何用dreamweaver制作網(wǎng)站下拉菜單效果
本文URL:http://bm7419.com/article40/pssdho.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站制作Google、建站公司品牌網(wǎng)站設(shè)計移動網(wǎng)站建設(shè)、網(wǎng)站建設(shè)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

搜索引擎優(yōu)化