A Polymer implementation of the proposed picture element utilizing florians compromise
CSS JavaScript
Latest commit 2ab78e2 Mar 18, 2014 @uniqname uniqname Merge pull request #5 from zenorocha/patch-1
Add "web-components" keyword
Permalink
Failed to load latest commit information.
css
js Include example with fallback image, included caution that this curre… Sep 11, 2013
.bowerrc
README.md no-js fallback Sep 23, 2013
bower.json Add "web-components" keyword Mar 10, 2014
favicon.ico Pages Sep 5, 2013
index.html Include example with fallback image, included caution that this curre… Sep 11, 2013
x-picture.html

README.md

x-picture

A Polymer implementation of the proposed <picture> element.

<x-picture alt="Description of content for accessability">
        <source srcset="http://www.fillmurray.com/300/600 1x, 
                        http://www.fillmurray.com/600/1200 2x" />
        <source srcset="http://www.fillmurray.com/400/600 1x, 
                        http://www.fillmurray.com/800/1200 2x" 
                        media="(min-width:400px)" />
        <source srcset="http://www.fillmurray.com/500/600 1x, 
                        http://www.fillmurray.com/1000/1200 2x" 
                        media="(min-width:500px)" />
        <source srcset="http://www.fillmurray.com/600/600 1x, 
                        http://www.fillmurray.com/1200/1200 2x" 
                        media="(min-width:600px)" />
        <source srcset="http://www.fillmurray.com/700/600 1x, 
                        http://www.fillmurray.com/1400/1200 2x" 
                        media="(min-width:700px)" />
        <!-- This is a fallback for no javascript, not a fallback for no <picture /> support. 
        That's what the prollyfill does ;) -->
        <noscript>
            <img src="http://www.placecage.com/c/800/800" alt="Nic Cage" lazyload>
        </noscript>
        <p>Paradoxally, I am invisible AND accessible.</p>
</x-picture>