Skip to content

Instantly share code, notes, and snippets.

@brschwar
Forked from tevko/respsizes.js
Created October 16, 2015 16:08
Show Gist options
  • Save brschwar/0cd4999290321c5aacae to your computer and use it in GitHub Desktop.
Save brschwar/0cd4999290321c5aacae to your computer and use it in GitHub Desktop.
Dev Tools Snippet to auto-calculate responsive image sizes value on window resize
/**
*
* Paste image class / identifier in IIFE parenthesis at end of function
*
* */
(function(i){"use strict";var img=document.querySelector(i),sizes=[];window.addEventListener("resize",()=>{var vw=Math.round(((img.offsetWidth*100)/window.innerWidth))+"vw",mq="(min-width: "+window.innerWidth+"px)",value=vw;vw!=="0vw"&&sizes.indexOf(vw)===-1&&(sizes.push(value),console.log(mq,vw))})})("PASTE CLASS OR IDENTIFIER HERE");
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment