Нас так же ищут по следующим запросам: jQuery плагин увеличения изображения, картинки, фото, скачать плагин бесплатно, jquery image zoom plugin, скрипт увеличения картинки, увеличительная лупа Cloud Zoom, jquery Лупа, javascript изображение, script free, сайт plugin, jquery zoomer, jquery photo zoom, image jquery plugin, jquery img zoom, jquery image zoom, jquery image zoom plugin free, jquery image resize plugin, image zoom script, image zoom javascript, javascript, free, download wordpress, joomla, drupal, zoomer, зуммер, фото зумер, зум, jQuery

ПРИМЕР 1

<!-- HTML -->

   <img class="my-foto" src="/images/image-small.jpg"  data-large="/images/image-big.jpg" title="Фото">
<!-- JAVASCRIPT -->

<script>
   jQuery(function(){
   
      $(".my-foto").imagezoomsl({
        
         zoomrange: [3, 3]
      });
   });   
</script>

ПРИМЕР 2

<!-- HTML -->

   <img class="my-foto" src="/images/image-small.jpg"  data-large="/images/image-big.jpg" 
               data-title="Red Valentino" data-help="Используйте колесико мыши для Zoom +/-" title="Фото">
<!-- JAVASCRIPT -->

<script>
   jQuery(function(){
   
       $(".my-foto").imagezoomsl({
	  
           zoomrange: [1, 10],
           cursorshadeborder: "10px solid #000",
           magnifiereffectanimate: "fadeIn",
           magnifierpos: "left"		
       });
   });   
</script>

ПРИМЕР 3

<!-- HTML -->

   <img class="my-foto" src="/images/image-small.jpg"  data-large="/images/image-big.jpg" 
               data-text-bottom="Осень-зима 2013/14 / Ready-To-Wear / НЕДЕЛЯ МОДЫ: Нью-Йорк" title="Фото">
<!-- JAVASCRIPT -->

<script>
   jQuery(function(){
   
       $(".my-foto").imagezoomsl({
	  
          zoomrange: [2.12, 12],
          magnifiersize: [530, 340],
          scrollspeedanimate: 10,
          loopspeedanimate: 5,
          cursorshadeborder: "10px solid black",
          magnifiereffectanimate: "slideIn"					
      });
   });   
</script>

ПРИМЕР 4

<!-- CSS -->

<style>
.my-container{
	border: 1px solid #F0F0F0; 
	width: 250px; 
	height: 250px;
}
</style>
<!-- HTML -->

   <img class="my-foto" src="/images/image-small.jpg"  data-large="/images/image-big.jpg" title="Фото">
   <div class="my-container"></div>   
<!-- JAVASCRIPT -->

<script>
   jQuery(function(){
   
       $(".my-foto").imagezoomsl({
	  
          descarea: ".my-container", 				
          zoomrange: [1, 12],
          magnifiereffectanimate: "fadeIn",
          magnifierborder: "none"		  
       });
   });   
</script>

ПРИМЕР 5

<!-- HTML -->

   <img class="my-foto" src="/images/image-small.jpg"  data-large="/images/image-big.jpg" title="Фото">
<!-- JAVASCRIPT -->

<script>
   jQuery(function(){
   
      $(".my-foto").imagezoomsl({
	  
         zoomrange: [1, 12],
         zoomstart: 4,
         innerzoom: true,
         magnifierborder: "none"		 
      });
   });   
</script>

ПРИМЕР 6

<!-- CSS3 -->

<!-- круглая лупа в Chrome и Firefox -->
<style>
.round-loupe{
   border-radius: 75px;
   border: 5px solid #F0F0F0;
}
</style>  
<!-- HTML -->

   <img class="my-foto" src="/images/image-small.jpg" data-large="/images/image-big.jpg" title="Фото">
<!-- JAVASCRIPT -->

<script>
jQuery(function(){
   
  $(".my-foto").imagezoomsl({
	  
      innerzoommagnifier: true,
      classmagnifier: window.external ? window.navigator.vendor === "Yandex" ? "" : "round-loupe" : "",
      magnifierborder: "5px solid #F0F0F0",                               // fix для Opera, Safary, Yandex		  
      zoomrange: [2, 8],
      zoomstart: 4,
      magnifiersize: [150, 150]		
  });
});   
</script>