Simple react hook for forcing an element to have a specific aspect ratio
npm install use-aspect-ratio --save
import { useAspectRatio } from 'use-aspect-ratio';
export const Test = () => {
const aspectRatio = 16 / 9;
const ref = useAspectRatio(aspectRatio);
return <img src={SomeImage} style={{ width: '100%' }} ref={ref} />;
};
import { useWindowSize } from 'use-aspect-ratio';
export const Test = () => {
const callback = (size) => {
doSomeTransformationOnResize();
};
const {
innerHeight,
innerWidth,
outerHeight,
outerWidth,
} = useWindowSize(callback);
return null;
};
Uses the MIT License