JavaScript元素根据父级元素宽高缩放
/**
* 等比缩放
* @param wrap 外部容器
* @param container 待缩放的容器
* @returns {{width: number, height: number}}
* 返回值:width:宽度, height:高度
*/
aspectRatio(wrap: any, container: any) {
// w = h / ratio, h = w * ratio
const wrapW = wrap.width;
const wrapH = wrap.height;
let cW = container.width;
let cH = container.height;
const rc = cW / cH;
if (rc > 1) {
// const w = wrapH * ratio;
if (cW <= wrapW) {
cW = wrapW;
cH = wrapW / rc;
}
} else if (rc < 1) { // w:h = w1:h1 =>
if (cH <= wrapH) {
cH = wrapH;
cW = rc * cH;
}
} else if (rc === 1) {
const v = wrapW > wrapH ? wrapH : wrapW;
cH = v;
cW = v;
}
return {
width: cW,
height: cH,
};
}
版权声明:
本站所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自
小森森博客!
喜欢就支持一下吧
打赏
微信
支付宝