javascript - Different size images in website depending on screen resolution -
i have website images, , page loading can slow on mobile devices have mobile internet connection. so, question is: assign different images, smaller or bigger depending on device, when page loaded solution?
example img in dom be:
<img src="" id="img1" alt="img1" />
and then, adding script in head:
$(document).ready(function () { loadimg(); })
the loadimg function can like:
if((window.screen.availheight < 1234)&&(window.screen.availwidth < 1234)) document.getelementbyid("img1").src = "small"; else document.getelementbyid("img1").src = "big";
try js library https://github.com/scottjehl/picturefill
i don't know how affects seo, though.
Comments
Post a Comment