MooBox 基于Mootools的對話框插件
一方面出于對mootools的興趣(雖然沒有jQuery那么hot), 另一方面,也是想為mootools的推廣添一點小小的力量,雖然這微不足道.
加上前面發(fā)布過的2個mootools組件, 寫下來總的感覺是:
在效果實現(xiàn)方面, 確實用jQuery編寫要比用mootools來的容易快速的多, 因為在很多細節(jié)問題上jQuery已經為我們考慮了.比如mootools-core沒有類似slideUp/Down這樣的方法, 如果不引入擴展庫的話,你得自己用Fx類來實現(xiàn), 而jQuery里只是很簡單的調用slideUp, slideDown或者slideToggle, 再比如在mootools中,你想取得一個隱藏(display:none)元素的尺寸信息, 得寫個幾條代碼, 而在jQuery中你完全可以忽略元素是否隱藏這個問題, 它已經幫你搞定了. 再比如jQuery本身已經為用戶提供了豐富的選擇器, 這一點尤為方便.mootools的話稍微欠缺一些.
我這里并不是說mootools如何不行,因為本身mootools和jquery設計的初衷就是不同的, 如果你想更多的了解細節(jié)問題,那么用mootools作為基礎庫還是不錯的.
下面回到文章正題, 我先發(fā)兩個Demo截圖.
完整顯示:
收縮的狀態(tài)
如果你對此組件有興趣, 可以點擊下載, MooBox 源碼均未壓縮,其中doc.html為組件說明文檔,demo.html是個比較完整的示例.
注意一個樣式的問題,希望你的頁面中事先引入了類似reset.css和定義基礎樣式的css(比如字體,顏色,行高等).
最后, 希望對你能有所幫助 : ) 有問題可以留言討論
相關文章
這幾天, 利用晚上的閑暇時間, 寫了個mootools組件,原型來自于jQuery UI Dialog, 為防止重復,就起了名字叫mooBox.2012-01-01
公司項目有這個需求，剛好這段時間在學習了mootools，于是把功能寫成了mootools插件，個人感覺mootools在這方面比jquery強多了2012-05-05
今天，我們來看一下如何通過MooTools 1.2和我們以前幾講中的內容來操作樣式，這將給你在UI上帶來很大的控制權。2009-09-09
今天我們將來看一下MooTools綁定的Tooltip插件。通過“提示（Tips）”，你可以輕松地自定義一個包含一個標題和內容的工具提示，可以自定義樣式，自定義淡入淡出漸變效果。2009-09-09
用Mootools獲得操作索引的兩種方法分享，需要的朋友可以參考下。2011-12-12
MooTools 頁面滾動浮動層智能定位實現(xiàn)代碼
MooTools 頁面滾動浮動層智能定位實現(xiàn)代碼，需要的朋友可以參考下。2011-08-08
今天我們來學習一下Fx.Elements插件，這是一個基于Fx.Morph的插件。與應用于單個元素不同的是，F(xiàn)x.Elements可以允許你一次性給多個元素添加動畫。2009-09-09
今天我們將講一下用MooTools來創(chuàng)建和使用類的一些基本知識。2009-09-09
使用Mootools動態(tài)添加Css樣式表代碼,兼容各瀏覽器
這個函數(shù)很有用處,尤其是當我們在使用Mootools開發(fā)插件的時候,例如Tips等,當我們需要額外的Css來支撐插件內的效果時,通常我們的做法是把Css放到單獨的css文件里調用2011-12-12
從今天開始，我們將開始講解“更多”（more）庫里面的更多插件。Sortables是一個非常強大的插件，能夠真正地擴大你的用戶界面設計的選擇面。2009-09-09