This ResizeFit was designed to fit the upper container of a div, similar to the fit attribute of an image element.
[resize-fit's demo](https://www.zsjs.fun/views/controlllers/resize-fit#fill) [resize-fit's demo](https://www.zsjs.fun/views/controlllers/resize-fit#contain) [resize-fit's demo](https://www.zsjs.fun/views/controlllers/resize-fit#fitHeight) [resize-fit's demo](https://www.zsjs.fun/views/controlllers/resize-fit#fitWidth) [resize-fit's demo](https://www.zsjs.fun/views/controlllers/resize-fit#fitWidthExtendHeight)npm install @zsjs/resize-fit;
import { ResizeFit } from "@zsjs/resize-fit";
<div id="father" style="width: 400px;height: 300px;border: 1px solid green;">
<div id="child" style="width: 100px;height: 200px;background-color: red;">
<span style="font-size: 58px;">ResizeFit</span>
</div>
</div>
const resizeFit = new ResizeFit();
resizeFit.init({
container: document.getElementById("father"),
target: document.getElementById("child"),
mode: "contain", // fill | contain | fitHeight | fitWidth | fitWidthExtendHeight |
})
// before unmount
resizeFit.dispose();
Remove the listener of ResizeObserver.
resizeFit.dispose();