🔔 Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

HiZoom is a concise, easily, lightly (3KB) magnifier plugin of jQuery.Features:Concise?document is exhaustive and clearlyLightly : the javascript file that compressed is just 3KB, and is one-twenty two of MagicZoom pluginBrowser Supported: Chrome, Firefox, Safiri, IE9+

Plugins Zoom

Documentation

HiZoom

HiZoom: A concise, easily, lightly (3KB) magnifier plugin of jQuery.

中文

Features


  • Concise:document is exhaustive and clearly
  • Lightly : the javascript file that compressed is just 3KB, and is one-twenty two of MagicZoom plugin
  • Browser Supported: Chrome, Firefox, Safiri, IE9+

Dependence


  • jQuery

Quick start


// download project git clone https://github.com/javashop/HiZoom.git
<!-- other code ... --> <link rel='stylesheet' href='./hizoom.min.css'>  <div class='hizoom gakki'>   <img src='./gakki.png'> </div> <div class='hizoom ldy'>   <img src='./ldy.png'> </div>  <script>   // Call the plugin   $('.gakki').hiZoom({     width: 400,     position: 'right'   });   $('.ldy').hiZoom({     width: 300,     position: 'left'   }); </script>

Config


Variable Description Value-Chosen Default
width width and height of magnifier container(square for now) A positive number 400
position direction of zoom left|right|top|bottom right
background background-color of magnifier Legal color value of CSS #FFF
opacity opacity of magnifier 0~1(legal CSS value) 0.7
distance distance between zoom area and magnifier container A positive number 20

TODO


  • Deal the rectangle image
  • Set the magnification by yourself
  • . . .

From

From Javashop ( http://www.javamall.com.cn )


You May Also Like