強大可跨越 iframe 的月曆套件 My97 DatePicker

更人性化,更全面的功能
大部分日期控件都具備功能如:帶時間顯示,支持周顯示,自定義格式,自動糾錯,智能糾錯,起始日期,操作按鈕自定義,快速選擇日期,支持多種調用模式等,My97DatePicker在這些方面做得更全面,更人性化,並且速度一流.

強大的日期範圍限制功能
支持靜態限制,動態限制,腳本自定義限制,以及無效天和無效日期功能,利用這樣功能你可以任意定制不能選擇的日期,這些日期即使毫無規律,毫無連續性,你也可以通過這些功能的組合使用輕鬆搞定.

自定義事件和豐富的API庫
如果你需要做一些附加的操作,你也不必擔心,日期控件自帶的自定義事件可以滿足你的需求.此外,你還可以在自定義事件中調用提供的API庫來做更多的運算和擴展,絕對可以通過很少的代碼滿足你及其個性化的需求.

多語言支持和自定義皮膚支持
通過lang屬性,可以為每個日期控件單獨配置語言,當然也可以通過WdatePicker.js配置全局的語言,皮膚也是一樣,只要配置skin屬性即可.這樣一個頁面中可以顯示多種語言,多種皮膚的日期控件,更棒的是,他們之間的切換是無刷新的.

跨無限級框架顯示和自動選擇顯示位置
無論你把日期控件放在哪裡,你都不需要擔心會被外層的iframe所遮擋進而影響客戶體驗,My97日期控件是可以跨無限級框架顯示的,並且當控件處在頁面邊界是,它會自動選擇顯示的位置.此外你還可以使用position參數對彈出位置做調整.

jQuery slimScroll

What is slimScroll?

slimScroll is a small (4.6KB) jQuery plugin that transforms any div into a scrollable area with a nice scrollbar - similar to the one Facebook and Google started using in their products recently. slimScroll doesn't occupy any visual space as it only appears on a user initiated mouse-over. User can drag the scrollbar or use mouse-wheel to change the scroll value.

css-element-queries

CSS-Element-Queries Polyfill. proof-of-concept for high-speed element dimension/media queries in valid css.

程式碼標示 Code Mirror

CodeMirror is a versatile text editor implemented in JavaScript for the browser. It is specialized for editing code, and comes with a number of language modes and addons that implement more advanced editing functionality.

(黑暗執行序) 以jQuery實現可編輯

網頁以<table>方式呈現數據矩陣，希望能做到在某一格(<td>)點兩下可以直接編輯格子文字內容，按Enter或點選其他格子結束編輯狀態，並將該格內容更新為剛才輸入結果。

介面如下圖所示，在<td>V11</td>上點兩下，V11就變成<input value=”V11”>，使用者可將<input>的值改成ZZZ，當按Enter或點其他<td>，該格內容就變成<td>ZZZ</td>。

這個需求要用jQuery實現並不難: 在<td>上掛dblclick事件，將<input type=”text”>放入td中，val()就設成td原本的text()；另外設定<input>的keydown及所有<td>的click事件，執行td.text(input.val())取input值寫成td內容就大功告成囉!

觸控滑動 - 頁面立體切換效果

這篇要介紹 jQuery Mobile 一個鮮為人知但又非常好用的功能：觸控！在使用行動版網頁或是製作 hybrid App 的時候，觸控通常都是一個大問題，一個單純區分 tap 和 mousedown、mouseover 之類的行為，可能都會讓程式變得十分複雜，好加在，jQuery Mobile 替我們解決掉了這個問題，既有的五種觸控事件，涵蓋了基本的手勢行為 ( 當然多點觸控就沒辦法了 )，因此我就利用觸控事件，搭配 CSS3 的 transform 3D ，做出立體又酷炫的切換效果！