object-fit polyfill only for images in IE. Every other browsers (Chrome, Safari, Firefox, Opera, Edge) supported 'object-fit' property. It help to fit the image into the containers.
Demo - Demo Link
It support from version 9. Below 9, still in progress.
objectFitIE.ieImg('image-wrapper-class-name', 'object-position x', 'object-position y', 'object-fit');
image-wrapper-class-name
- place your wrapper class name here. see the example below -
<div class='wrapper-name'>
<img src='' alt=''>
</div>
It will target the class wrapper-name
. Make sure, within the wrapper only one image will be there.
object-position x
andobject-position y
- place the values for x and y axis. just like theobject-position
in css.object-fit
- place theobject-fit
value just like you put it in css.
- create the wrapper of the image where you want to apply
object-fit
property. - include the
object-fit-ie.js
file in your codebase. - call this before
</body>
-
objectFitIE.ieImg('image-wrapper-class-name', 'object-position x', 'object-position y', 'object-fit');
- and see it in IE browser.