Skip to content

Instantly share code, notes, and snippets.

@mizalewski
Created November 28, 2018 20:25
Show Gist options
  • Save mizalewski/d9125428363dbe5e6301638de839dea2 to your computer and use it in GitHub Desktop.
Save mizalewski/d9125428363dbe5e6301638de839dea2 to your computer and use it in GitHub Desktop.
Scalable images
(function () {
var yMargin = document.querySelector('.navigation-top').getBoundingClientRect().height + 'px';
var xMargin = '0px';
if (window.screen.width < 1150) {
xMargin = '20px';
}
Array.prototype.slice.call(document.querySelectorAll('.blocks-gallery-item img')).forEach(function (image) {
var ratio = image.offsetWidth / image.offsetHeight;
var maxWidth = 'calc((calc(100vh - ' + yMargin + ')) * ' + ratio + ' + ' + xMargin + ')';
console.log(maxWidth);
image.style.maxWidth = maxWidth;
});
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment