已解決430363個問題，去搜搜看，總會有你想問的

以編程方式調整 PNG 的大小

首頁猿問以編程方式調整 PNG 的大小

以編程方式調整 PNG 的大小

JavaScript

慕桂英546537 2022-01-07 11:06:51

我有一系列 png 文件，我需要根據窗口大小動態調整大小。一些代碼片段（斷章取義）：var scale = this.props.scaleFactor ? this.props.scaleFactor : 1;originalHeight:number = 244;originalWidth:number = 744;height: `${this.originalHeight / scale}px`,width: `${this.originalWidth / scale}px`,有了這個，我可以通過scaleFactor手動修改為我想要的任何大?。ㄐ∮趏riginalHeight和originalWidth.我的問題是我是否以及如何scaleFactor根據窗口大小動態更改，例如：scaleFactor = window.innerHeight..somethingsomething.....;這可以通過一些甜蜜的數學或算法來完成嗎？

查看完整描述

2 回答

慕桂英3389331

TA貢獻2036條經驗獲得超8個贊

你可以使用這樣的東西。調整大小完成后，它將觸發 500 毫秒，并為您提供新寬度與舊寬度的比率：

let id = false;

let window_width = window.innerWidth;

window.addEventListener('resize', (e)=>{

if(id != false) clearTimeout(id);

id = setTimeout(()=>{

console.log('resizing finished');

let new_window_width = window.innerWidth;

let ratio = new_window_width / window_width;

console.log('ratio:', ratio);

// do something here?

window_width = new_window_width;

}, 500)

})

反對回復 2022-01-07

皈依舞

TA貢獻1851條經驗獲得超3個贊

不要在 javascript 中計算樣式。

看看calc()。

.scaled-image {

width: calc(100% / 2);

}

反對回復 2022-01-07

2 回答
0 關注
173 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

以編程方式調整 PNG 的大小

以編程方式調整 PNG 的大小

2 回答

添加回答