廣告高手:手把手教你做彈出窗口

2019-11-04 12:15:51

字體：大中小

來源：轉載

供稿：網友

　　眾所周知，不論是政府網站，還是商業平臺，也不論是個人站點還是綜合門戶，進入這些網站，大都會或多或少地彈出一些窗口。實際上，制作這樣的彈出式窗口非常簡單，下面我就為大家介紹一款制作彈出式窗口的軟件，希望能對你設計網站有所幫助。

　　軟件名稱：PopUpWiz

　　軟件類別：共享軟件

　　最新版本：PopUpWiz v1.01

　　軟件大小：1.46MB

　　下載地址：http://www.info-pack.com/bin/puw101.exe

　　該軟件的安裝非常簡單，一路回車即可完成安裝。下面我以PopUpWiz v1.01為例，介紹它的使用方法。

　　一、設置及查看彈出窗口

　　啟動PopUpWiz，如圖1所示，通過PopUpWiz提供的多個選項，我們可以為彈出式窗口設置外觀、大小、位置及激發它彈出的事件等。

廣告高手:手把手教你做彈出窗口

圖1

　　Name——彈出式窗口的名字。

　　URL——彈出式窗口所顯示頁面的URL地址。

　　在Popup Feartures區提供的選項，可以設置彈出式窗口的外觀，主要包括彈出式窗口是否顯示導航欄（Directories）、是否顯示菜單欄（Menu Bar）、是否顯示地址欄（Location）、是否答應改變窗口大小（Resizable）以及是否顯示滾動條（Scroll Bars）、狀態欄（Status Bar）、工具欄（Toolbar）。

　　在Popup Size區提供的選項，可以改變彈出式窗口的高度(Hieght)和寬度(Width)。

　　在Popup Position區，我們可以在水平方向和垂直方向調整彈出式窗口的位置。

　　Show Again?選項可以把相關信息保存在cookie中，在設定的時間內，防止進入主頁面再次彈出窗口。

　　When to PopUp區提供的選項最為重要，在這里要設置激發彈出窗口的事件：

　　On Load——載入主頁面時，彈出一個窗口。

　　On Close——離開主頁面時，彈出一個窗口。

　　On Button——點擊一個鏈接或按鈕，彈出一個窗口。

　　設置完以上選項后，你可以點擊Test Popup按鈕，在默認的瀏覽器中查看彈出式窗口的效果（注重，在瀏覽器中會打開一個主頁面，它是PopUpWiz用來測試彈出窗口而設置的，保存在PopUpWiz的安裝目錄中），假如覺得滿足，你就可以拷貝、粘貼源代碼到你的主頁面中去了。

　　二、拷貝、粘貼源代碼

　　PopUpWiz實際上就是一個源代碼的生成器，通過以上設置，假如你對彈出式窗口的效果還滿足，點擊Create Popup按鈕，PopUpWiz彈出“Results”對話框，如圖2所示，它為我們提供了兩段源代碼，對于javascript Functions區內的源代碼，點擊Copy Functions按鈕把該區內的源代碼拷貝到剪貼板，然后加入到你主頁面的…標簽中即可；至于Load Function Source區內的源代碼，要根據上文所述的激發彈出窗口事件的不同，分別處理：

廣告高手:手把手教你做彈出窗口

圖2

　　當彈出窗口設置為“On Load”，也就是載入主頁面，彈出一個窗口時，點擊Copy Loader按鈕，把Load Function Source區內的源代碼拷貝到剪貼板，粘貼源代碼使你的主頁面的<body>…</body>標簽的起始標簽為即可。

　　當彈出窗口設置為“On Close”，也就是離開主頁面，彈出一個窗口時，點擊Copy Loader按鈕，把Load Function Source區內的源代碼拷貝到剪貼板，粘貼源代碼使你的主頁面的<body>…</body>標簽的起始標簽<body>為<body onUnload="popupwiz()">即可。

　　當彈出窗口設置為“On Button”，也就是點擊一個鏈接或按鈕，彈出一個窗口時，假如是一個鏈接（圖片鏈接和文字鏈接均可），點擊Copy Loader按鈕，把Load Function Source區內的源代碼拷貝到剪貼板，粘貼并修改該鏈接源代碼<a href="#">…</a>的起始標簽<a href="#">為<a href="#" OnClick="popupwiz()">(#是一個虛擬鏈接，代表該超級鏈接指向資源的URL地址)即可；假如是一個按鈕，點擊Copy Loader按鈕，把Load Function Source區內的源代碼拷貝到剪貼板，粘貼并修改按鈕的源代碼<input type="button" value="按鈕名">為<input type="button" OnClick="popupwiz()" value="按鈕名">即可。

上一篇：我們班的校友錄很炫（上）

下一篇：校友錄還可以這樣玩