Skip to content

Instantly share code, notes, and snippets.

@jdsimcoe
Forked from tevko/respsizes.js
Created October 15, 2015 21:08
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jdsimcoe/a5c01d6a622b86f66673 to your computer and use it in GitHub Desktop.
Save jdsimcoe/a5c01d6a622b86f66673 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