image - jquery - picture element swap in ie 11 -
hi using piece of jquery swap background images via picture element depending on viewport width. works in mst browser except ie 11.
does have idea why? appreciated. in advance.
function setimgbackground(){ $('.banner-item').each( function(){ var $this = $(this); var picture = $this.find('picture').get(0); var src = picture.getelementsbytagname('img')[0].currentsrc; $(this).css({ 'background-image':'url('+src+')' }); }); } <ul class="bannercontainer"> <li class="banner-item full about"> <picture> <!--[if ie 9]></video><![endif]--> <source srcset="https://via.placeholder.com/1664x412? text=desktop_1664x412" media="(min-width: 960px)"> <source srcset="https://via.placeholder.com/768x500?text=tablet_768x500" media="(min-width: 768px)"> <source srcset="https://via.placeholder.com/414x500?text=mobile_414x500" media="(min-width: 0px)"> <!--[if ie 9]></video><![endif]--> <img alt="product" class="mobilebg"> </picture> </li> </ul>
here link codepen
Comments
Post a Comment