Respify响应式图像库

Respify 是个简单的响应式图像库，可以从一系列 span 子节点的 data-media 和 src 属性解析图像，使用媒体查询来选择图像。在线演示

Respify可以在图像标签或任何其他标签上使用，但背景选项应设置为true。从span子节点数组中重新指定wil pop，这意味着将首先解析列表中的最后一个节点。如果Respify找到一个匹配的媒体查询，它将使用相应的图像并停止搜索。

<span id="default-responsive" class="responsive-img" data-alt="This is an example of a responsive image">
	<span src="img/yacht_race@mobile.jpg" data-media="(max-width: 30em)"></span>
	<span src="img/yacht_race@wide-mobile.jpg" data-media="(min-width: 30em) and (max-width: 48em)"></span>
	<span src="img/yacht_race@tablet.jpg" data-media="(min-width: 48em) and (max-width: 60em)"></span>
	<span src="img/yacht_race@desktop.jpg" data-media="(min-width: 60em) and (max-width: 80em)"></span>
	<span src="img/yacht_race@hires.jpg" data-media="(min-width: 80em)"></span>

	<noscript><img src="ext/img/yacht_race@hires.jpg" alt="A yacht race"></noscript>
</span>