Prototype Window Class:http://prototype-window.xilinus.com/

昨天亂逛到的一個AJAX Framework,主要訴求是希望讓Web開發者透過Prototype Window Class便可以輕鬆地在網頁上產生各式各樣的視窗(Window or Windows)。

比較吸引我的是Prototype Window Class的文件很完整,使用起來應該不會有太大困難,再加上Sample網頁有幾個範例很吸引我,像是登入視窗的特效,很簡單就可以做出類似HEMiDEMi或是Netvibes的登入效果,對我這種懶人而言,不需要多研究什麼東西就可以完成一件事情是多麼美好的事情!
(稍微翻譯一下它的首頁好了orz,沒什麼技術能力可以充實內容,只好靠英文字典了XD)

Overview

根據Prototype Window Class首頁的說法,它是以Prototype為基礎開發出來的,同時是「inspired by the powerful script.aclou.us」(這個說法很酷,之前有聽到script.aclou.us是Driven and Inspired by Ruby on Rails,這麼推演的話,RoR真的是非常偉大!),目前已經在Safari, Camino, Firefox以及IE6等瀏覽器上測試過。

Features特色

  • Prototype Window Class所產生的code都是 Valid HTML/XHTML
  • 可調整大小的視窗
  • 支援最大化、最小化視窗(Maximize/Minimize)
  • Modal dialogs(看不懂,大概就是可以產生「確認、取消」之類的對話視窗)
  • 各種視覺效果
  • 可更換Skin

How to Use使用方式

首先在網頁上插入以下程式碼,最後一行是Themes的設定,要更換視窗風格只要修改此行即可:

<script src="/javascripts/prototype.js" type="text/javascript"> </script>
<script src="/javascripts/window.js" type="text/javascript"> </script>
<link href="/stylesheets/themes/default.css" type="text/css" rel="stylesheet" />
<!-- Add this to have a specific theme-->
<link href="themes/mac_os_x.css" type="text/css" rel="stylesheet" />

接下來是進行宣告視窗的動作:

win = new Window('window_id', {className: "mac_os_x", title: "Sample", width:200, height:150});
win.getContent().innerHTML = "<h1>Hello world !!</h1>";
win.setDestroyOnClose();
win.showCenter(); [/js]