On clique ici ou là... et reclic sur la zone de zoom pour enlever le
zoom.
1° ça marche chez vous ?
2° je voudrais modifier ça pour qu'au lieu de cliquer, il suffit de
balader la souris. J'ai fait un ou deux tests, mais ce n'est pas
vraiment fluide.
J'essaie de faire un script permettant de zoomer sur un endroit d'une image et pour l'instant, voilà ce que cela donne : <http://astrophoto.free.fr/usenet-fr/fclj/test-image.html> http://mokhet.com/tests/zoom_image.html
Est-ce que c'est assez fluide ? :D (pas testé sous IE7, je l'ai pas)
Super Laurent ! Parfait ! Génial ! Super !!! Je peux t'emprunter ton code ???
Bien entendu que tu peux prendre tout ce que tu veux dans ce code. C'est en licence fais en ce que tu veux :D Mais bon, en l'état c'est loin d'être fini.
-- laurent
On 12 fév, 19:00, Laurent vilday <mok...@mokhet.com> wrote:
J'essaie de faire un script permettant de zoomer sur un endroit d'une
image et pour l'instant, voilà ce que cela donne :
<http://astrophoto.free.fr/usenet-fr/fclj/test-image.html>
http://mokhet.com/tests/zoom_image.html
Est-ce que c'est assez fluide ? :D (pas testé sous IE7, je l'ai pas)
Super Laurent ! Parfait ! Génial ! Super !!! Je peux t'emprunter ton
code ???
Bien entendu que tu peux prendre tout ce que tu veux dans ce code. C'est
en licence fais en ce que tu veux :D
Mais bon, en l'état c'est loin d'être fini.
J'essaie de faire un script permettant de zoomer sur un endroit d'une image et pour l'instant, voilà ce que cela donne : <http://astrophoto.free.fr/usenet-fr/fclj/test-image.html> http://mokhet.com/tests/zoom_image.html
Est-ce que c'est assez fluide ? :D (pas testé sous IE7, je l'ai pas)
Super Laurent ! Parfait ! Génial ! Super !!! Je peux t'emprunter ton code ???
Bien entendu que tu peux prendre tout ce que tu veux dans ce code. C'est en licence fais en ce que tu veux :D Mais bon, en l'état c'est loin d'être fini.
-- laurent
Laurent vilday
Le coup du zoom rond là je le sens pas (pas avant les css-et-dom 4 ou 5) Laurent ?
En css je vois pas de solution pour faire un rond.
Par contre, avec canvas tout est imaginable. Enfin presque tout parce que tant que le support ne sera pas un minimum homogène entre les navigateurs, on ira pas bien loin.
Marche que pour FX2, les autres (IE6 et OP9 pour moi) ont conservé la loupe carrée d'origine. J'ai un peu galéré pour mon premier script utilisant du canvas. Le temps de comprendre doc basique du MDC avec des ronds déjà ça a été coton.
http://mokhet.com/tests/zoom_image_canvas.html
Mais bien qu'ayant perdu en fluidité (sniff :(, je suis fier de pouvoir annoncer que le challenge de la loupe ronde, avec manche en bois intégré, est relevé. Bon ok, c'est très moyen comme code mais au moins ça marche sur *1* navigateur :D
Sous Opéra 9, je n'arrive pas - ni à appliquer un simple context.clip() http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#Clipping_paths
- ni à appliquer un masque http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#globalCompositeOperation
Hors on a besoin de l'un ou l'autre, à ce que j'en ai compris, pour pouvoir faire la zone ronde de la loupe. Est-ce que qqun aurait une idée pour le faire passer sous OP9 ? J'ai du me tromper qqpart, mais j'y connais rien à canvas et je sais pas trop où chercher.
Quand à IE6, ca ne marche évidemment pas. J'ai essayé d'utiliser un "adapteur" canvas/VML, malheureusement en vain. OK, J'avoue ne pas avoir envie de chercher à comprendre le VML de IE6 :D http://me.eae.net/archive/2005/12/29/canvas-in-ie/
J'imagine que sous Safari et autres navigateurs chelous :)) ça marchera pas non plus. Tant pis :D
-- laurent
Le coup du zoom rond là je le sens pas (pas avant les css-et-dom 4 ou 5)
Laurent ?
En css je vois pas de solution pour faire un rond.
Par contre, avec canvas tout est imaginable. Enfin presque tout parce
que tant que le support ne sera pas un minimum homogène entre les
navigateurs, on ira pas bien loin.
Marche que pour FX2, les autres (IE6 et OP9 pour moi) ont conservé la
loupe carrée d'origine. J'ai un peu galéré pour mon premier script
utilisant du canvas. Le temps de comprendre doc basique du MDC avec des
ronds déjà ça a été coton.
http://mokhet.com/tests/zoom_image_canvas.html
Mais bien qu'ayant perdu en fluidité (sniff :(, je suis fier de pouvoir
annoncer que le challenge de la loupe ronde, avec manche en bois
intégré, est relevé. Bon ok, c'est très moyen comme code mais au moins
ça marche sur *1* navigateur :D
Sous Opéra 9, je n'arrive pas
- ni à appliquer un simple context.clip()
http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#Clipping_paths
- ni à appliquer un masque
http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#globalCompositeOperation
Hors on a besoin de l'un ou l'autre, à ce que j'en ai compris, pour
pouvoir faire la zone ronde de la loupe. Est-ce que qqun aurait une idée
pour le faire passer sous OP9 ? J'ai du me tromper qqpart, mais j'y
connais rien à canvas et je sais pas trop où chercher.
Quand à IE6, ca ne marche évidemment pas.
J'ai essayé d'utiliser un "adapteur" canvas/VML, malheureusement en
vain. OK, J'avoue ne pas avoir envie de chercher à comprendre le VML de
IE6 :D
http://me.eae.net/archive/2005/12/29/canvas-in-ie/
J'imagine que sous Safari et autres navigateurs chelous :)) ça marchera
pas non plus. Tant pis :D
Le coup du zoom rond là je le sens pas (pas avant les css-et-dom 4 ou 5) Laurent ?
En css je vois pas de solution pour faire un rond.
Par contre, avec canvas tout est imaginable. Enfin presque tout parce que tant que le support ne sera pas un minimum homogène entre les navigateurs, on ira pas bien loin.
Marche que pour FX2, les autres (IE6 et OP9 pour moi) ont conservé la loupe carrée d'origine. J'ai un peu galéré pour mon premier script utilisant du canvas. Le temps de comprendre doc basique du MDC avec des ronds déjà ça a été coton.
http://mokhet.com/tests/zoom_image_canvas.html
Mais bien qu'ayant perdu en fluidité (sniff :(, je suis fier de pouvoir annoncer que le challenge de la loupe ronde, avec manche en bois intégré, est relevé. Bon ok, c'est très moyen comme code mais au moins ça marche sur *1* navigateur :D
Sous Opéra 9, je n'arrive pas - ni à appliquer un simple context.clip() http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#Clipping_paths
- ni à appliquer un masque http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#globalCompositeOperation
Hors on a besoin de l'un ou l'autre, à ce que j'en ai compris, pour pouvoir faire la zone ronde de la loupe. Est-ce que qqun aurait une idée pour le faire passer sous OP9 ? J'ai du me tromper qqpart, mais j'y connais rien à canvas et je sais pas trop où chercher.
Quand à IE6, ca ne marche évidemment pas. J'ai essayé d'utiliser un "adapteur" canvas/VML, malheureusement en vain. OK, J'avoue ne pas avoir envie de chercher à comprendre le VML de IE6 :D http://me.eae.net/archive/2005/12/29/canvas-in-ie/
J'imagine que sous Safari et autres navigateurs chelous :)) ça marchera pas non plus. Tant pis :D
-- laurent
Laurent vilday
Le coup du zoom rond là je le sens pas (pas avant les css-et-dom 4 ou 5) Laurent ?
http://mokhet.com/tests/zoom_image_canvas.html
Sous Opéra 9, je n'arrive pas - ni à appliquer un simple context.clip() http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#Clipping_paths - ni à appliquer un masque http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#globalCompositeOperation
J'ai trouvé pour Opéra, en fait mon problème ne venait pas du clipping qui lui fonctionne très bien, mais du context.drawImage(source) qui n'accepte *que* une source <img> (comme FX1.5) et pas une source <canvas> comme j'avais fait dans la version précédente.
Enfin bref, ça marche aussi sous opéra 9 dans la version 3 du script. Toujours pas le courage de chercher a le faire tourner en VML sous IE :p
http://mokhet.com/tests/zoom_image_v3.html
Mais c'est clair que là ça rame à donf, un sacré paquet de truc à restructurer/améliorer si on veut utiliser "l'outils", mais bon on s'en fout comme dirait Stéphane :D
-- laurent
Le coup du zoom rond là je le sens pas (pas avant les css-et-dom 4 ou 5)
Laurent ?
http://mokhet.com/tests/zoom_image_canvas.html
Sous Opéra 9, je n'arrive pas
- ni à appliquer un simple context.clip()
http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#Clipping_paths
- ni à appliquer un masque
http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#globalCompositeOperation
J'ai trouvé pour Opéra, en fait mon problème ne venait pas du clipping
qui lui fonctionne très bien, mais du context.drawImage(source) qui
n'accepte *que* une source <img> (comme FX1.5) et pas une source
<canvas> comme j'avais fait dans la version précédente.
Enfin bref, ça marche aussi sous opéra 9 dans la version 3 du script.
Toujours pas le courage de chercher a le faire tourner en VML sous IE :p
http://mokhet.com/tests/zoom_image_v3.html
Mais c'est clair que là ça rame à donf, un sacré paquet de truc à
restructurer/améliorer si on veut utiliser "l'outils", mais bon on s'en
fout comme dirait Stéphane :D
Le coup du zoom rond là je le sens pas (pas avant les css-et-dom 4 ou 5) Laurent ?
http://mokhet.com/tests/zoom_image_canvas.html
Sous Opéra 9, je n'arrive pas - ni à appliquer un simple context.clip() http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#Clipping_paths - ni à appliquer un masque http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#globalCompositeOperation
J'ai trouvé pour Opéra, en fait mon problème ne venait pas du clipping qui lui fonctionne très bien, mais du context.drawImage(source) qui n'accepte *que* une source <img> (comme FX1.5) et pas une source <canvas> comme j'avais fait dans la version précédente.
Enfin bref, ça marche aussi sous opéra 9 dans la version 3 du script. Toujours pas le courage de chercher a le faire tourner en VML sous IE :p
http://mokhet.com/tests/zoom_image_v3.html
Mais c'est clair que là ça rame à donf, un sacré paquet de truc à restructurer/améliorer si on veut utiliser "l'outils", mais bon on s'en fout comme dirait Stéphane :D
-- laurent
ASM
Le coup du zoom rond là je le sens pas (pas avant les css-et-dom 4 ou 5) Laurent ?
http://mokhet.com/tests/zoom_image_canvas.html
Y a rien qui marche ici avec Safari, Ha si ! on peut balader le manche de la loupe :-)
Sous Opéra 9, je n'arrive pas - ni à appliquer un simple context.clip() http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#Clipping_paths - ni à appliquer un masque http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#globalCompositeOperation
J'ai trouvé pour Opéra, en fait mon problème ne venait pas du clipping qui lui fonctionne très bien, mais du context.drawImage(source) qui n'accepte *que* une source <img> (comme FX1.5) et pas une source <canvas> comme j'avais fait dans la version précédente.
Enfin bref, ça marche aussi sous opéra 9 dans la version 3 du script. Toujours pas le courage de chercher a le faire tourner en VML sous IE :p
http://mokhet.com/tests/zoom_image_v3.html
Tiens ? et pourquoi j'ai pas le rond sous Safari ? Pourtant,je croyais qu'il causait bien le canvas ? Trop vieille version ? (1,3) Mais c'est très fluide comme au 1er jour.
Mais c'est clair que là ça rame à donf,
Pour ramer ça rame avec Opera ! et comment se fait-ce ?
un sacré paquet de truc à restructurer/améliorer si on veut utiliser "l'outils", mais bon on s'en fout comme dirait Stéphane :D
Moi ? je dis ça ? jamais !
Bon, je récapitule mes essais
fichier FF 2 Opera Safari zoom_image OK 10 OK 9 OK 10 zoom_image_canvas OK 4,5 [_] 9 manche seul 10 zoom_image_v3 OK 5,5 OK 5,3 [] 10
légende : OK : fait ce que attendu [_] : loupe carrée + bordure (sans manche) [] : loupe carrée sans bordure (avec manche) chiffre : vitesse (fluidité)
-- Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Le coup du zoom rond là je le sens pas (pas avant les css-et-dom 4 ou 5)
Laurent ?
http://mokhet.com/tests/zoom_image_canvas.html
Y a rien qui marche ici avec Safari,
Ha si ! on peut balader le manche de la loupe :-)
Sous Opéra 9, je n'arrive pas
- ni à appliquer un simple context.clip()
http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#Clipping_paths
- ni à appliquer un masque
http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#globalCompositeOperation
J'ai trouvé pour Opéra, en fait mon problème ne venait pas du clipping
qui lui fonctionne très bien, mais du context.drawImage(source) qui
n'accepte *que* une source <img> (comme FX1.5) et pas une source
<canvas> comme j'avais fait dans la version précédente.
Enfin bref, ça marche aussi sous opéra 9 dans la version 3 du script.
Toujours pas le courage de chercher a le faire tourner en VML sous IE :p
http://mokhet.com/tests/zoom_image_v3.html
Tiens ? et pourquoi j'ai pas le rond sous Safari ?
Pourtant,je croyais qu'il causait bien le canvas ?
Trop vieille version ? (1,3)
Mais c'est très fluide comme au 1er jour.
Mais c'est clair que là ça rame à donf,
Pour ramer ça rame avec Opera !
et comment se fait-ce ?
un sacré paquet de truc à
restructurer/améliorer si on veut utiliser "l'outils", mais bon on s'en
fout comme dirait Stéphane :D
Moi ? je dis ça ? jamais !
Bon, je récapitule mes essais
fichier FF 2 Opera Safari
zoom_image OK 10 OK 9 OK 10
zoom_image_canvas OK 4,5 [_] 9 manche seul 10
zoom_image_v3 OK 5,5 OK 5,3 [] 10
légende :
OK : fait ce que attendu
[_] : loupe carrée + bordure (sans manche)
[] : loupe carrée sans bordure (avec manche)
chiffre : vitesse (fluidité)
--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Le coup du zoom rond là je le sens pas (pas avant les css-et-dom 4 ou 5) Laurent ?
http://mokhet.com/tests/zoom_image_canvas.html
Y a rien qui marche ici avec Safari, Ha si ! on peut balader le manche de la loupe :-)
Sous Opéra 9, je n'arrive pas - ni à appliquer un simple context.clip() http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#Clipping_paths - ni à appliquer un masque http://developer.mozilla.org/en/docs/Canvas_tutorial:Compositing#globalCompositeOperation
J'ai trouvé pour Opéra, en fait mon problème ne venait pas du clipping qui lui fonctionne très bien, mais du context.drawImage(source) qui n'accepte *que* une source <img> (comme FX1.5) et pas une source <canvas> comme j'avais fait dans la version précédente.
Enfin bref, ça marche aussi sous opéra 9 dans la version 3 du script. Toujours pas le courage de chercher a le faire tourner en VML sous IE :p
http://mokhet.com/tests/zoom_image_v3.html
Tiens ? et pourquoi j'ai pas le rond sous Safari ? Pourtant,je croyais qu'il causait bien le canvas ? Trop vieille version ? (1,3) Mais c'est très fluide comme au 1er jour.
Mais c'est clair que là ça rame à donf,
Pour ramer ça rame avec Opera ! et comment se fait-ce ?
un sacré paquet de truc à restructurer/améliorer si on veut utiliser "l'outils", mais bon on s'en fout comme dirait Stéphane :D
Moi ? je dis ça ? jamais !
Bon, je récapitule mes essais
fichier FF 2 Opera Safari zoom_image OK 10 OK 9 OK 10 zoom_image_canvas OK 4,5 [_] 9 manche seul 10 zoom_image_v3 OK 5,5 OK 5,3 [] 10
légende : OK : fait ce que attendu [_] : loupe carrée + bordure (sans manche) [] : loupe carrée sans bordure (avec manche) chiffre : vitesse (fluidité)
-- Stephane Moriaux et son (moins) vieux Mac déjà dépassé
GraphSeb
http://mokhet.com/tests/zoom_image.html Est-ce que c'est assez fluide ? :D (pas testé sous IE7, je l'ai pas)
Super fluide sous Firefox 2.0 Windows ! Mais c'est chiant le pointeur de la souris en plein milieu du zoom ;-)
Excellent ce truc !
S'il n'y a que ça qui te gêne, un petit coup de "fignolage" :
