一般來說，處理照片上傳 resize 時，都是在 server 接到圖片之後，然後在 server 端重新 resize，不過其實也可以用 javascript 把圖片先 resize 之後，再上傳，請看範例在http://jsfiddle.net/KEN73CHEN/5czZt/1/。
不過提醒你，如果你是覺得這個作法，可以節省頻寬的話，那麼你就要失望了。
因為，圖片可能本來是 jpeg 壓縮的很好，但是為了要處理，用 data URL 轉成大字串之後，就變大了，而且可能大很多！不過 resize 之後，又會變小，但是大很多之後又變小，可能：
- 就真的變小了，省到頻寬
- 反而比較大，沒省到頻寬
所以這是廢文一篇。
不過還是有好處，使用者在操作上，會更直覺，照片可以用拖曳的，也可以用點選的，而且上傳前可以先看到照片，這似乎成為基本人權了。
在實際運用上，可以在使用者 submit 表單之前，先用 ajax 上傳圖檔， 省下等待的時間。
Mootools More 的部分，只用到了 Assert，改寫成 onload，不難。
為什麼用 Mootools？
- 你不覺得他名字很可愛嗎！
- Mootools 比較像 javascript。
不過提醒你，即使你用了這個方法，先用 javascript resize 圖檔，到了 server 端，還是要處理一次，不能直接把接到的東西就當成已經處理好的東西，這是基本原則。
再強調一下了，要養成習慣，即使是：
<input name="email" placeholder="your email" type="email" > 到了 PHP，還是得檢查一次：
$email = filter_input(INPUT_POST,'email',FILTER_SANITIZE_STRING,FILTER_SANITIZE_EMAIL);不這樣的話，你的手會抽筋，為什麼會抽筋，純粹只是中了我的詛咒。