Recadrer une photo (mode Facebook)

Question

Bonjour à tous,

Je cherche à faire un script permettant de recadrer une photo. 
J'en ai trouvé, mais tous ces scripts affiche la photo taille réelle et on sélectionne ensuite la partie voulu.

Pour ma part, je veux un fonctionnement différent et proche de ce qu'on trouve sur Facebook à savoir : 

J'ai un cadre aux dimensions x et y. 
La photo est affichée dedans, si le cadre est plus petit, une partie de la photo n'est pas affiché.
Ensuite, il suffit de déplacer la photo dans le cadre pour la cadrer comme on le souhaite.

J'utilise peu javascript et je suis actuellement sur un projet sous Zend Framework. Zend est livré avec Dojo, donc si vous avez une idée sur Dojo, c'est mieux, mais je ne vais pas faire mon difficile ;)

Merci pour vos lumières.

Stoomm.

Bul3 · Answer

Bonjour,
>>Pour ma part, je veux
quand on veut... on peut.
et vous pouvez aussi, par exemple, vous inspirer
de ZI ici, qui est une loupe sur une image,
"il suffit" de mettre le zoom à 1.
et/mais je suis bien certain que d'autres sources
existent ici... et ailleurs
tant qu'à Zend, dojo...et le reste : aucune idée
Cordialement

Stoomm · Answer

Hello,

Merci pour votre réponse. Cependant ce comportement là ne correspond pas à ceux que je veux. Pour ce type de fonctionnement, je vous invite à aller voir du coté de Jcrop qui fait ca très bien.

Pour ma part, je cherche à avoir un fonctionnement similaire a celui de facebook à savoir : 
J'ai un cadre de 100 x 100 par exmple et une photo de 200 x 200. 
La photo ne sera donc pas affiché dans la globalité, seul la partie dans le cadre sera affiché. 
En déplacant l'image dans le cadre, on change la zone affichée. A partir de la on peut finaliser et donc cadrer la partie de l'image à afficher.

Si certains ont des idées ou piste ... merci ;)

Bul3 · Answer

je vous invite à retester mon exemple
car c'est ce que ça fait en fait,
même s'il faut adapter pour coller parfaitement
à votre souci ( sucrer les choses inutiles,
ne pas mettre d'image à survoler ... )
regarder le comportement du div sur l'image
agrandie ou pas.

Bul3 · Answer

vous ne voyez pas ?







et il vous suffit de jouer avec le top et le left
de la manière dont vous le voulez...

Bul3 · Answer

tenez, j'ai trouvé amusant, et, j'espère 
instructif, pour d'aucuns
de faire un exemple : DSI, c'est ici

Stoomm · Answer

Hello Bul3 :)

Honte à moi, je n'avais pas comrpis la subtilité du premier exemple. Je n'ai pas encore une expérience suffisante coté css et div pour savoir comment directement cacher une partie d'une image comme cela ;) Maintenant que vous m'avez montré, en effet, cela me parait simple...

J'ai télécharger votre exemple, et je vais m'en inspirer. Je vous remercie beaucoup pour ce coup de main.

Ca va me retirer une grosse épine du pied.

Merci beaucoup.

Mickaël.

Bul3 · Answer

vous savez, quand un intervenant quelconque
vous dit de regarder un exemple, il faut prendre
le temps de le faire. même s'il dit des
conneries ( ça m'arrive souvent ) ça
peut aiguiller, aider...

Recadrer une photo (mode Facebook)

7 réponses

Votre réponse

Discussions similaires