Description
So now when I want to have a 100% wide 16:9 image (think thumbnail) I have to calculate the height manually, I have to get the width of the (actual rendered) image and then put it through the /16*9 calculation.
One could think that something like this would render an 16:9 auto sizing image.
<div class="container">
<div class="row align-items-stretch">
<div class="col-md-12">
<img data-src="holder.js/16x9?auto=yes"/>
</div>
</div>
</div>
Right now with would be holder.js/100px624?auto=yes for a md-12 column on a large screen, but that second dimension is screen size dependent. Which makes it unusable, outside of my own development machine screen. (624=1110/16*9, with 1110 being the tested rendered width at 100%)
Maybe either and extra flag or another unit. say 100px56r (With the r referring to ratio and thus the percentage of the actual width (forced and recalculated))
Or maybe 16rx9r?auto=yes and that making a autoscaling (fill the container until on of the sides "hit" any thing, being height or width.)
Or an extra flag forceAspect with the size given in a 100px56p type of way.
I looked at the source but I'm quite lost. Right now I tried to just wrap the script, but it is not very user friendly.
Maybe something for v3?