使用銳EtreProprio.com
2010年3月2日,7:18 |在發展 , 在野生 , YUI的實現由菲利普Bernou上午| 2評論 作者簡介:
菲利普Bernou的創始人和法國的啟動的的首席執行官EtreProprio.com ,為個人的房地產網站。 IBM技術在盧森堡工作四年後,他於2008年推出與奧莉楊仁EtreProprio.com。
EtreProprio.com旨在提供免費的高品質分類( 見這裡上市的例子 )。 目前有超過五千業主上EtreProprio.com銷售他們的房子。 我們希望提供一個簡單但功能強大的接口,我們需要大量的前端邏輯。 經過一個小試驗,我們選擇了銳襲擊了我們強大的,強大的,非常有據可查和高度可定制的。 因此,EtreProprio.com使用YUI(2.8.0)巨資用於其前端。
使用以下模塊:
- CSS:復位,基地
- 公用事業:動畫,連接管理器,餅乾,數據源,拖放,JSON的
- 部件:自動完成“按鈕,日曆,集裝箱,DataTable中,即食,滑塊,TabView,提
讓我們去更深的三種實現:高級搜索,照片上傳和TabView。
高級搜索
用於查找屬性的形式自動完成和雙滑塊頂部。 以上的滑塊大拇指標籤的位置,聽來改變事件。 然後,他們將重新定位,如果min和max標籤之間發生碰撞。 可以顯示自動完成實施,如城市,郵政編碼或地區的混合元素。 每個元素都有其自己的顯示格式。
嘗試直播 。
照片上傳+管理
我們使用YUI的上傳 , 數據表和拖放模塊以創建簡單的形式上傳照片。 首先,用戶可以選擇他的電腦上的照片。 然後,他點擊“發送所有”和發送照片,一張桌子下面的照片和細節填充。 拖動和下降應用於表中的行,它允許用戶輕鬆地重新排列照片。 使用一個簡單的文字輸入和YUI的XMLHttpRequest實用, 連接管理器,可以修改的每一張照片的說明。
看到下面的演示視頻:
TabView
由於有大量的信息,顯示廣告的細節,我們用TabView設計的頁面。 TabView CSS的個性化功能讓我們頁面的其餘從設計的角度來看,它完美地整合。 我們也節省了tabview帶寬作為唯一感興趣的用戶點擊所有的標籤- TabView支持lazyloading標籤內容 ,以及該模式適用於我們這裡。
共享和擴展: 書籤del.icio.us Digg它! | reddit!
2評論
很抱歉,評論已被封閉,在這個時候。


這是令人印象深刻。 我想,Craigslist的線索,將採取從您的網站,其在美國的房子房源!
評論由威爾遜- 2010年3月3日,
哇,真棒。 我總是優先考慮的jQuery,但我遇到越來越多的網站使用YUI。 我想我可能需要有一看,看到你在這裡做。 好工作。
評論CSS網頁設計廊 - 3月19日,2010 #