讓圖片真正自適應的jQuery插件：ResponsifyJS

一個jquery插曲件讓圖片能夠真正自適應，不會犧牲圖像的主要部分。

在線演示：http://responsifyjs.space/#demo 

How to use

1. Use this interactive web app to generate the focus area data http://responsifyjs.space/app/

   <img src="image.png" alt="" 
     data-focus-left=".30" data-focus-top=".12" data-focus-right=".79" data-focus-bottom=".66" />

   data-focus-leftis the focus area's left position comparing to the image's full width, in decimal. For example, if the full width is 300px, the focus area's left is 90, then thedata-focus-leftshould be 90/300 =0.3. Same logic applies to other three data attributes.

2. Embed the responsify.js in the html

   <script src="responsify.js"></script>

3. Call responsify function when window object is loaded

   $(window).load(function() {
       $('img').responsify();
     });

4. Call responsify function again when the window is being resized (optional)

   $(window).resize(function(){
       $('img').responsify();
     })

項目主頁：http://www.baiduhome.net/lib/view/home/1449017171202