對Jquery上傳頭像擷取程式碼的更新

weixin_34344677發表於2009-04-02

在前面我發過一篇《》,使用JQuery+Jquery.UI實現了該功能,因為無法設定容器意外的元素作為Handler,所以只能用兩張圖片模擬一張並同步拖拽來實現效果(後來有空看了一下程式碼,其實Jquery.UI是可以設定容器意外的元素作為handler的),但是一直沒有時間去修改它。

最近在做一個MVC的專案中,需要重新整理一下控制元件,所以乾脆在開發純JS的基於Jquery,有些是自己開發,有些來源於網路,有些是原型來源於網路改了一些內容。順便也把這個擷取的也改了,由於JQuery.UI太累贅問題也不少,程式碼不太好修改,所以使用了Jquery.easyDrag這個外掛來代替它,可以從這裡(http://fromvega.com/wordpress/2007/07/14/easydrag-jquery-plugin/)獲取它的原始碼。

Jquery.easyDrag基於jquery 1.2.6開發,如果使用最新版的Jquery1.3.2的話會有些問題,我做了一點點修改,可以從文末下載的程式碼中獲取我修改後的程式碼。

效果沒有太大的變化

image

image

 

也不多做介紹了,原理在前文中都已說過,這次只是稍微修改了一些差異程式碼。HTML有所調整,參考開心網的程式碼,使用Table加TD的方式實現外部蒙層,中間透明的效果,也改為使用一張圖片了。

 

在IE7,Firefox3, chorme 2上測試正常,如有問題可以反饋

 

下載更新後的程式碼

 

順便貼幾張 控制元件的圖,如果有時間,我會一一介紹下面的控制元件,但是我真的挺懶的。。。

Grid

image

image image

 

日期選擇

image

Vista 樣式的樹

image

Dropdown的基類,預設實現DropDownList

image

Dropdowntree

image

多級的右鍵選單

image

div模擬模態視窗

image

手風琴

image

相關文章