Skip to content

Instantly share code, notes, and snippets.

@ericwbailey
Last active March 2, 2019 16:55
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ericwbailey/7138149 to your computer and use it in GitHub Desktop.
Save ericwbailey/7138149 to your computer and use it in GitHub Desktop.
Mobify.js responsive <picture> example with accessible descriptive text. #comment #smashing
<picture data-src="http://cdn.mobify.com/mobifyjs/examples/assets/images/responsive-obama-mobile.jpg">
<source src="//ir0.mobify.com/webp/400/http://cdn.mobify.com/mobifyjs/examples/assets/images/responsive-obama-mobile.jpg">
<source src="//ir0.mobify.com/webp/400/http://cdn.mobify.com/mobifyjs/examples/assets/images/responsive-obama.jpg" media="(min-width: 512px)">
<source src="//ir0.mobify.com/webp/512/http://cdn.mobify.com/mobifyjs/examples/assets/images/responsive-obama.jpg" media="(min-width: 1024px)" data-width="512">
<source src="//ir0.mobify.com/webp/512/http://cdn.mobify.com/mobifyjs/examples/assets/images/responsive-obama.jpg" media="(min-width: 2048px)" data-width="1024">
<img src="responsive-obama.jpg">
<p>A photograph of United States President Barack Obama shaking hands.</p>
</picture>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment