JavaScript drag and drop photo Resizer Cropper

Question

J'ai une image de taille arbitraire sur la page. En sortie je besoin d'une image d'une taille fixe, disons 90x120px . Je voudrais que l'utilisateur de choisir la zone de l'image par glisser-déposer la grande image derrière le 90x120px « fenêtre ». La fenêtre préciserait l'image résultante. Quelque chose comme cela est mis en œuvre à facebook télécharger l'image .

Je sais comment faire face à l'image au back-end dès que je reçois les coordonnées de culture, aucun problème. Je suppose que je dois poster les coordonnées de culture dans les champs de formulaire cachés. L'action glisser-déposer de l'utilisateur devrait JavaScript remplir les champs, non? Je suis nouveau à JS, donc un guide étape par étape aiderait beaucoup.

Answer 1

1. Familiarisez-vous avec jQuery. Il vous gagner du temps dans tout projet js / DHTML
2. http://interface.eyecon.ro/demos/drag.html http://interface.eyecon.ro/demos/resize.html http://interface.eyecon.ro/download
3. ???
4. Résultat

Answer 2

Pour rogner, utilisez jQuery et Jcrop .