在本教學中，我將以最通俗的語言和最簡潔的程式碼為大家示範如何建立一個JavaScript彈出DIV視窗層的效果。
建立一個彈出DIV視窗可能是現在網站/網頁製作中最常碰到的問題之一。傳統的JavaScript彈窗已經不適合目前網站的設計理念了，理由有二：首先，不友好——生硬的彈出對話框且伴隨著“喲”的一聲對用戶體驗是個很大的挑戰；其次，兼容性不夠強－有相當多的瀏覽器屏蔽了這種JS的Alert()方法。於是，一個良好使用者體驗的網站需要一個更合理的解決方案－使用很少的HTML程式碼，很少的CSS程式碼和幾行的JavaScript程式碼來模擬瀏覽器預設的彈出視窗（即替換掉預設的Alert()介面和功能）。
實作原理：
首先，我們將彈出框中的內容放置在一個特殊的DIV層中，然後預設隱藏它（即初始不可見，使用CSS即可實現）。當使用者執行某個動作時－例如點擊某個連結或將滑鼠遊標移到某個連結上－我們將先前設定好的隱藏層顯示在所有頁面元素的最上層（將使用JS操作實作）。此外，我們還將在彈出DIV視窗中設定一個按鈕來執行－當使用者點擊此按鈕時關閉視窗的功能。
實現過程：
就如我上面提到的，我們首先需要創建一個特殊的DIV層，然後我們將彈出視窗的內容放在這個DIV層裡面。在這裡，我們將其ID命名為「popupcontent 」以區別於其他DIV層。
