search

scottjehl / picturefill

A responsive image polyfill for <picture>, srcset, sizes, and more
http://scottjehl.github.com/picturefill/
MIT License
9.88k stars 1.07k forks source link

Not seeing any polyfill functionality in Safari 11.0.3 #700

Closed nate-sanders closed 6 years ago

nate-sanders commented 6 years ago

I have included the following markup in <head>: 

<script>
        // Picture element HTML5 shiv
      document.createElement( "picture" );
</script>
<script src="vendors/picturefill.min.js" async></script>

And I have the following syntax for images in <body>: 

<picture>
    <source class="logo" srcset="#filepath-here.webp"  alt="Alt tag description filled out" />
    <source class="logo" srcset="#filepath-here.png"  alt="Alt tag description filled out" /> 
    <img class="logo" srcset="#filepath-here.png" alt="Alt tag description filled out" />
</picture>

With that markup, all of the images are still broken in Safari. No console errors. Script loads fine in the browser. I've also alternatively tried using src="" instead of srcset="" for the fallback <img> but still experiencing broken images there.

nate-sanders commented 6 years ago

I just added type="image/webp" to the first webp source and the polyfill works.