In picturefill.js, how to write other than the above specified?

52 Views Asked by At

In picturefill.js, how to write other than the above specified?

In the following, what to write and how do the conditions specified that other than the above (less than the screen width 480px)?

※I want to specify the thumb.jpg


Some to the difference between writing pattern A and the pattern B?

Which is correct?


Pattern A

<picture>
 <!--[if IE 9]><video style="display: none;"><![endif]-->
 <source srcset="main.jpg" media="(min-width: 480px)">
 <!--[if IE 9]></video><![endif]-->
 <img srcset="thumb.jpg" alt="">
</picture>

Pattern B

<picture>
 <!--[if IE 9]><video style="display: none;"><![endif]-->
 <source srcset="main.jpg" media="(min-width: 480px)">
 <source srcset="thumb.jpg">
 <!--[if IE 9]></video><![endif]-->
 <img srcset="thumb.jpg" alt="">
</picture>
1

There are 1 best solutions below

0
On BEST ANSWER

Technically they are both correct*, and functionally equivalent, but A is preferable because the source element is completely unnecessary, since it repeats the same information already specified in img.

*) with the exception that src is a required attribute on img, but that is an intended violation when using picturefill in order to avoid double download in legacy browsers.