fonds d'écran - créations numériques - webmastering - photograhie - création de site - référencement efficace


 

 

Pour tous les webmasters, des effets professionnels de zoom ou d'agrandissement sur les images : Magic Zoom™ est un ensemble d'outils basé sur JavaScriptl. Il vous donne les meilleures possibilités d'affichage pour créer des effets surprenants. Ce script de zoom ou d'grandissement sur image est adopté par les plus grands sites marchands professionnels. La licence, pour un site 'personnel' est gratuite, celle pour un site professionnel est payante.

Webmastering pro : Magic Zoom Plus

Position du zoom personnalisée

Zoom sur image | Dimensions de la vue | Multiples images | Hotspots | Hotspots advanced | Zoom positions | Zoom position paramétrable | Fade-in et vitesse d'affichage | Options d'opacité | Personnalisation avec les CSS | Zoom ou agrandissement |

Position de la zône de zoom personnalisable et agrandissement de l'image

Cette fonction personnalise la fenêtre d'affichage du zoom et vous permet aussi d'agrandir l'image en cliquant dessus.


Voir les explications sur le Blog en cliquant sur ce lien.

Le code du zoom image personnalisé:

  1. <html>
  2.     <head>
  3.         <title>Magic Zoom Plus: Custom zoom position</title>
  4.        
  5.         <!-- link to magiczoomplus.css file -->
  6.         <link href="magiczoomplus/magiczoomplus.css" rel="stylesheet" type="text/css" media="screen"/>
  7.         <!-- link to magiczoomplus.js file -->
  8.         <script src="magiczoomplus/magiczoomplus.js" type="text/javascript"></script>
  9.        
  10.     </head>
  11.     <body>
  12.        
  13.         <p>The zoom window can be placed anywhere on your page</p>
  14.         <!-- define Magic Zoom Plus -->
  15.         <a href="images/harley1c.jpg" class="MagicZoomPlus" id="zoom" rel="zoom-position: custom; zoom-width: 178px; zoom-height:430px;"><img src="images/harley1b.jpg"/></a><br/>
  16.  
  17.         <div id="zoom-big" style="position: absolute; left: 20px; top: 242px"></div>
  18.        
  19.     </body>
  20. </html>