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.

Magic Zoom Plus™

Magic Zoom

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 |

Multiples images

Un Zoom pour plusieurs images différentes.


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

Voici le codage:

  1. <html>
  2.     <head>
  3.         <title>Magic Zoom Plus: Multiple images</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>Zoom into many different images.</p>
  14.  
  15.         <!-- define Magic Zoom Plus -->
  16.         <a href="images/harley1c.jpg" class="MagicZoomPlus" id="Zoomer" title="Harley-Davidson Dyna Wide Glide"><img src="images/harley1b.jpg"/></a> <br/>
  17.  
  18.         <!-- define alternate views -->
  19.         <a href="images/harley1c.jpg" rel="zoom-id:Zoomer" rev="images/harley1b.jpg"><img src="images/harley1a.jpg"/></a>
  20.         <a href="images/harley2c.jpg" rel="zoom-id:Zoomer" rev="images/harley2b.jpg"><img src="images/harley2a.jpg"/></a>
  21.  
  22.        
  23.     </body>
  24. </html>