javascript - Getting the size of a resized BG image -
i have div background image, size set contain
:
.image{ width: 95%; height: 95%; position: absolute; margin: 0 auto; left: 0; right: 0; top: 50%; -webkit-transform: translatey(-50%); background-image: url('image_url'); background-size: contain; background-repeat: no-repeat; background-position: center center; }
large images being "scaled down" fit in div. want width , height of image after scaled down background-size: contain;
i tried following:
var myimg, frame; document.addeventlistener("domcontentloaded", onload); function onload() { myimg= document.getelementbyid('image'); frame = document.getelementbyid('frame'); var img = new image(); img.src = window.getcomputedstyle(myimg).getpropertyvalue("background-image").replace(/url\(|\)$/ig, ""); img.onload = function() { var imgheight = img.height; console.log(imgheight); } }
the problem i'm getting size of actual image, not resized one. can done? also, need use plain vanilla js, not jquery or other library...
Comments
Post a Comment