日期：2012-8-31  来源：

 

中，很重要的一个部分就是图片的设计，今天我们将介绍一个超棒的帮助你生成响应式图片设计的jQuery插件 -。使用它能够帮助你快速的生成支持响应式设计的图片。

主要特性

• 插件非常小，压缩版2kb
• 支持figure标签及其新加入的picture标签
• 支持主流浏览器 
• 使用方便

如何使用

初始化js插件：

$(function(){        $('figure, picture').picture();    });HTML：    
     
        
                  
                   
     

大家可以看到以上代码中，我们设定了media query的对应值，这里我们使用html5的data属性设定不同宽度的显示图片。

另外这个插件还支持picture标签，这个标签还不是合法的html标签。

HTML：

同样调用js，如下：

........

来源：