SlideShare a Scribd company logo
1 of 4
Effet de zoom sur une image au passage de la souris ISET   2009-2010
PRESENTATION DU CODE  Il s'agit d'un code en   javascript   qui permet d'augmenter jusqu'à un certain niveau prédéfini ou réglé, la taille ou les dimensions d'une image au passage de la souris tout en gardant une bonne qualité visuelle.  Ensuite de la réduire lorsqu'on  l'enlève(souris), afin de revenir à la taille initiale qui sera également prédéfinie. Dans la pratique ,ce code peut être utilisé par exemple dans la conception des  sites de vente en ligne ou le visiteur avec une certaine flexibilité ,souhaite parfois avoir un aperçu plus édifiant de l'article qu'il veut acheter ou commander.  P:hristianeme Annéerojet_javascriptichiersource.txt
Critiques et suggestions Ce code ne peut gérer qu'une image par les fonctions qu'elle contient . Par conséquent, il n'est pas  « évolutif » .Car l'idéal serait que les fonctions qu'il contient puissent gérer plusieurs images. Nous avons donc effectuer des modifications afin d'outrepasser cette limite. La   modification a consisté à utiliser plutôt l'objet  images[ ]  qui se trouve sous l'objet Windows, et qui par contre permet de gérer tous les graphiques définis dans un fichier Html. Ainsi ,on pourra transmettre comme argument l' index  ou le  nom de l'image  à traiter aux différentes fonctions( changer,initial ).  Enfin, notre modification à consister aussi à faire par une fonction (Diapo)   que nous   avons créée, un * diaporama  relatif à l'image dès que celle-ci est complètement a-grandie. *  Le lancement du diaporama  géré par l'évènement   « OnClick »   et se faisant par un  simple clic droit sur l'image. Le code modifié: ZOOM_IMAGE
Merci pour votre attention...

More Related Content

Viewers also liked

Roy jones jr
Roy jones jrRoy jones jr
Roy jones jrJaviRoma
 
La veille de Red Guy du 17.04.13 - la customisation
La veille de Red Guy du 17.04.13 - la customisationLa veille de Red Guy du 17.04.13 - la customisation
La veille de Red Guy du 17.04.13 - la customisationRed Guy
 
Programme Forum 2008
Programme Forum 2008Programme Forum 2008
Programme Forum 2008Cap'Com
 
La veille de Red Guy du 23.01.13 - les médias en inde
La veille de Red Guy du 23.01.13 - les médias en indeLa veille de Red Guy du 23.01.13 - les médias en inde
La veille de Red Guy du 23.01.13 - les médias en indeRed Guy
 
Los retos de la mundialización
Los retos de la mundializaciónLos retos de la mundialización
Los retos de la mundializaciónnurygd
 
OwniSciences
OwniSciencesOwniSciences
OwniSciencesKnowtex
 
Résultats enquête DiaMed "Diasporas et Entrepreneuriat au Maghreb" – ACIM – ...
Résultats enquête DiaMed  "Diasporas et Entrepreneuriat au Maghreb" – ACIM – ...Résultats enquête DiaMed  "Diasporas et Entrepreneuriat au Maghreb" – ACIM – ...
Résultats enquête DiaMed "Diasporas et Entrepreneuriat au Maghreb" – ACIM – ...OUADA Yazid
 
Test jorge garcía y álvaro pérez
Test jorge garcía y álvaro pérezTest jorge garcía y álvaro pérez
Test jorge garcía y álvaro pérezmcclane
 
Paganini(esp).pp.
Paganini(esp).pp.Paganini(esp).pp.
Paganini(esp).pp.giulianaCh
 
Viva la gente(1)
Viva la gente(1)Viva la gente(1)
Viva la gente(1)Carbayu
 
Politiques envers les Migrants Hautement Qualifiés: Canada, Etats-Unis, Union...
Politiques envers les Migrants Hautement Qualifiés: Canada, Etats-Unis, Union...Politiques envers les Migrants Hautement Qualifiés: Canada, Etats-Unis, Union...
Politiques envers les Migrants Hautement Qualifiés: Canada, Etats-Unis, Union...Hristina Petrova
 

Viewers also liked (20)

Roy jones jr
Roy jones jrRoy jones jr
Roy jones jr
 
Estilos de aprendizaje_2
Estilos de aprendizaje_2Estilos de aprendizaje_2
Estilos de aprendizaje_2
 
La veille de Red Guy du 17.04.13 - la customisation
La veille de Red Guy du 17.04.13 - la customisationLa veille de Red Guy du 17.04.13 - la customisation
La veille de Red Guy du 17.04.13 - la customisation
 
Creasenso
CreasensoCreasenso
Creasenso
 
Programme Forum 2008
Programme Forum 2008Programme Forum 2008
Programme Forum 2008
 
sourire
souriresourire
sourire
 
Embarazo
EmbarazoEmbarazo
Embarazo
 
La veille de Red Guy du 23.01.13 - les médias en inde
La veille de Red Guy du 23.01.13 - les médias en indeLa veille de Red Guy du 23.01.13 - les médias en inde
La veille de Red Guy du 23.01.13 - les médias en inde
 
Autoevaluacion instiucional
Autoevaluacion instiucionalAutoevaluacion instiucional
Autoevaluacion instiucional
 
Los retos de la mundialización
Los retos de la mundializaciónLos retos de la mundialización
Los retos de la mundialización
 
OwniSciences
OwniSciencesOwniSciences
OwniSciences
 
Résultats enquête DiaMed "Diasporas et Entrepreneuriat au Maghreb" – ACIM – ...
Résultats enquête DiaMed  "Diasporas et Entrepreneuriat au Maghreb" – ACIM – ...Résultats enquête DiaMed  "Diasporas et Entrepreneuriat au Maghreb" – ACIM – ...
Résultats enquête DiaMed "Diasporas et Entrepreneuriat au Maghreb" – ACIM – ...
 
Presentación1
Presentación1Presentación1
Presentación1
 
Pédophilie
PédophiliePédophilie
Pédophilie
 
Les volcans
Les volcansLes volcans
Les volcans
 
Test jorge garcía y álvaro pérez
Test jorge garcía y álvaro pérezTest jorge garcía y álvaro pérez
Test jorge garcía y álvaro pérez
 
Paganini(esp).pp.
Paganini(esp).pp.Paganini(esp).pp.
Paganini(esp).pp.
 
Viva la gente(1)
Viva la gente(1)Viva la gente(1)
Viva la gente(1)
 
Installation joomla 1-7
Installation joomla 1-7Installation joomla 1-7
Installation joomla 1-7
 
Politiques envers les Migrants Hautement Qualifiés: Canada, Etats-Unis, Union...
Politiques envers les Migrants Hautement Qualifiés: Canada, Etats-Unis, Union...Politiques envers les Migrants Hautement Qualifiés: Canada, Etats-Unis, Union...
Politiques envers les Migrants Hautement Qualifiés: Canada, Etats-Unis, Union...
 

Similar to Projet javascript

Responsive design, Canvas et SVG
Responsive design, Canvas et SVGResponsive design, Canvas et SVG
Responsive design, Canvas et SVGChristian SUMBANG
 
Intégrer la problématique du responsive image dans WordPress
Intégrer la problématique du responsive image dans WordPressIntégrer la problématique du responsive image dans WordPress
Intégrer la problématique du responsive image dans WordPressAlexandre Sadowski
 
HD HOMES 2013 Fr
HD HOMES 2013 FrHD HOMES 2013 Fr
HD HOMES 2013 Frhdhomes
 
MobiliteaTime #5 : Responsive & Adaptive Design
MobiliteaTime #5 : Responsive & Adaptive Design MobiliteaTime #5 : Responsive & Adaptive Design
MobiliteaTime #5 : Responsive & Adaptive Design USERADGENTS
 
Incorporation d'un fichier 3d dans word press
Incorporation d'un fichier 3d dans word pressIncorporation d'un fichier 3d dans word press
Incorporation d'un fichier 3d dans word pressBruno Mineo
 
Nouveautes Flash CS4, par Nicolas Gans - Regart.net formations
Nouveautes Flash CS4, par Nicolas Gans - Regart.net formationsNouveautes Flash CS4, par Nicolas Gans - Regart.net formations
Nouveautes Flash CS4, par Nicolas Gans - Regart.net formationsmaru.maru
 
Webdesign sites web et mobiles-tendances 2015
Webdesign sites web et mobiles-tendances 2015Webdesign sites web et mobiles-tendances 2015
Webdesign sites web et mobiles-tendances 2015Olivier Dommange
 
Les bases du responsive design
Les bases du responsive designLes bases du responsive design
Les bases du responsive designVoyelle Voyelle
 
7 astuces pour optimiser ses images façon seo
7 astuces pour optimiser ses images façon seo7 astuces pour optimiser ses images façon seo
7 astuces pour optimiser ses images façon seoagencecsv
 
Guide d'utilisation site colibri ville
Guide d'utilisation   site colibri villeGuide d'utilisation   site colibri ville
Guide d'utilisation site colibri villePeggy Le Déaut ☂️
 
La puissance des pseudo-éléments
La puissance des pseudo-élémentsLa puissance des pseudo-éléments
La puissance des pseudo-élémentsGeoffrey Croftє
 
jQuery mobile / PhoneGap : contenus dynamiques client-side
jQuery mobile / PhoneGap : contenus dynamiques client-sidejQuery mobile / PhoneGap : contenus dynamiques client-side
jQuery mobile / PhoneGap : contenus dynamiques client-sidemaru.maru
 
CSS%2B-%2BNiv2%2B-%2BExercices%2Bsuppl%25C3%25A9mentaires (3).pdf
CSS%2B-%2BNiv2%2B-%2BExercices%2Bsuppl%25C3%25A9mentaires (3).pdfCSS%2B-%2BNiv2%2B-%2BExercices%2Bsuppl%25C3%25A9mentaires (3).pdf
CSS%2B-%2BNiv2%2B-%2BExercices%2Bsuppl%25C3%25A9mentaires (3).pdfadeljaouadi
 
Codedarmor 2012 - 06/03 - HTML5, CSS3 et Javascript
Codedarmor 2012 - 06/03 - HTML5, CSS3 et JavascriptCodedarmor 2012 - 06/03 - HTML5, CSS3 et Javascript
Codedarmor 2012 - 06/03 - HTML5, CSS3 et Javascriptcodedarmor
 

Similar to Projet javascript (20)

Responsive design, Canvas et SVG
Responsive design, Canvas et SVGResponsive design, Canvas et SVG
Responsive design, Canvas et SVG
 
Intégrer la problématique du responsive image dans WordPress
Intégrer la problématique du responsive image dans WordPressIntégrer la problématique du responsive image dans WordPress
Intégrer la problématique du responsive image dans WordPress
 
HD HOMES 2013 Fr
HD HOMES 2013 FrHD HOMES 2013 Fr
HD HOMES 2013 Fr
 
MobiliteaTime #5 : Responsive & Adaptive Design
MobiliteaTime #5 : Responsive & Adaptive Design MobiliteaTime #5 : Responsive & Adaptive Design
MobiliteaTime #5 : Responsive & Adaptive Design
 
Lisez moi
Lisez moiLisez moi
Lisez moi
 
Incorporation d'un fichier 3d dans word press
Incorporation d'un fichier 3d dans word pressIncorporation d'un fichier 3d dans word press
Incorporation d'un fichier 3d dans word press
 
Utiliser WordPress
Utiliser WordPressUtiliser WordPress
Utiliser WordPress
 
Nouveautes Flash CS4, par Nicolas Gans - Regart.net formations
Nouveautes Flash CS4, par Nicolas Gans - Regart.net formationsNouveautes Flash CS4, par Nicolas Gans - Regart.net formations
Nouveautes Flash CS4, par Nicolas Gans - Regart.net formations
 
Formation ps
Formation psFormation ps
Formation ps
 
Webdesign sites web et mobiles-tendances 2015
Webdesign sites web et mobiles-tendances 2015Webdesign sites web et mobiles-tendances 2015
Webdesign sites web et mobiles-tendances 2015
 
Les bases du responsive design
Les bases du responsive designLes bases du responsive design
Les bases du responsive design
 
7 astuces pour optimiser ses images façon seo
7 astuces pour optimiser ses images façon seo7 astuces pour optimiser ses images façon seo
7 astuces pour optimiser ses images façon seo
 
Guide d'utilisation site colibri ville
Guide d'utilisation   site colibri villeGuide d'utilisation   site colibri ville
Guide d'utilisation site colibri ville
 
Prezi&cie
Prezi&ciePrezi&cie
Prezi&cie
 
Prezi&cie
Prezi&ciePrezi&cie
Prezi&cie
 
La puissance des pseudo-éléments
La puissance des pseudo-élémentsLa puissance des pseudo-éléments
La puissance des pseudo-éléments
 
Cv2015
Cv2015Cv2015
Cv2015
 
jQuery mobile / PhoneGap : contenus dynamiques client-side
jQuery mobile / PhoneGap : contenus dynamiques client-sidejQuery mobile / PhoneGap : contenus dynamiques client-side
jQuery mobile / PhoneGap : contenus dynamiques client-side
 
CSS%2B-%2BNiv2%2B-%2BExercices%2Bsuppl%25C3%25A9mentaires (3).pdf
CSS%2B-%2BNiv2%2B-%2BExercices%2Bsuppl%25C3%25A9mentaires (3).pdfCSS%2B-%2BNiv2%2B-%2BExercices%2Bsuppl%25C3%25A9mentaires (3).pdf
CSS%2B-%2BNiv2%2B-%2BExercices%2Bsuppl%25C3%25A9mentaires (3).pdf
 
Codedarmor 2012 - 06/03 - HTML5, CSS3 et Javascript
Codedarmor 2012 - 06/03 - HTML5, CSS3 et JavascriptCodedarmor 2012 - 06/03 - HTML5, CSS3 et Javascript
Codedarmor 2012 - 06/03 - HTML5, CSS3 et Javascript
 

Projet javascript

  • 1. Effet de zoom sur une image au passage de la souris ISET 2009-2010
  • 2. PRESENTATION DU CODE Il s'agit d'un code en javascript qui permet d'augmenter jusqu'à un certain niveau prédéfini ou réglé, la taille ou les dimensions d'une image au passage de la souris tout en gardant une bonne qualité visuelle. Ensuite de la réduire lorsqu'on l'enlève(souris), afin de revenir à la taille initiale qui sera également prédéfinie. Dans la pratique ,ce code peut être utilisé par exemple dans la conception des sites de vente en ligne ou le visiteur avec une certaine flexibilité ,souhaite parfois avoir un aperçu plus édifiant de l'article qu'il veut acheter ou commander. P:hristianeme Annéerojet_javascriptichiersource.txt
  • 3. Critiques et suggestions Ce code ne peut gérer qu'une image par les fonctions qu'elle contient . Par conséquent, il n'est pas « évolutif » .Car l'idéal serait que les fonctions qu'il contient puissent gérer plusieurs images. Nous avons donc effectuer des modifications afin d'outrepasser cette limite. La modification a consisté à utiliser plutôt l'objet images[ ] qui se trouve sous l'objet Windows, et qui par contre permet de gérer tous les graphiques définis dans un fichier Html. Ainsi ,on pourra transmettre comme argument l' index ou le nom de l'image à traiter aux différentes fonctions( changer,initial ). Enfin, notre modification à consister aussi à faire par une fonction (Diapo) que nous avons créée, un * diaporama relatif à l'image dès que celle-ci est complètement a-grandie. * Le lancement du diaporama  géré par l'évènement « OnClick » et se faisant par un simple clic droit sur l'image. Le code modifié: ZOOM_IMAGE
  • 4. Merci pour votre attention...