scale的空白問題

2022-01-13 07:03:46 字數 1101 閱讀 5815

一直沒有很好地重視這個問題,導致這次不得不面對,經過各種搜尋,各種嘗試,終於解決了這個留白問題

大小盒子,小盒子進行縮放,大盒子依據縮放來進行動態更改高寬

//style 樣式

.box

.dv

#btn

// html

我的天空

點選切換

//js

function $(name)

const boxwidth = $('.box').offsetwidth,

dvwidth = $('.dv').offsetwidth,

boxheight = $('.box').offsetheight,

dvheight = $('.dv').offsetheight

const scale = boxwidth / dvwidth

// 關鍵部位 高度縮放 對父盒子進行高度縮放,這樣就不會有留白的

// dv縮放後實際的高度

const dvscaleheight = dvheight * scale

// 父盒子縮放的高度

const boxscale = dvscaleheight / boxheight

$('#btn').onclick = function() ) translatex(-50%)`

$('.dv').style.transformorigin = `0 top`

$('.box').style.height = boxheight * boxscale + 'px'

}

未縮放前的原始效果

縮放後的效果沒有空白

解決marquee空白問題

左右迴圈連續滾動 解決marquee的留白問題 向上 向下 向左 向右 乙個設定寬度並且隱藏超出它寬度的內容的容器demo,裡面放demo1和demo2,demo1是滾動內容,demo2為demo1的直接轉殖副本,通過不斷改變demo1的scrolltop或者scrollleft達到滾動的目的.向上...

oracle em 登入頁面空白問題

環境 遠端虛擬機器 公司提供的統一的遠端訪問環境,可以申請不同的虛擬機器 作業系統 windows 2008 oracle版本 11.2 安裝結束後,順利完成配置網路服務名,啟動後台的各個服務。登陸dbconsole頁面 http locaohost 1158 em 頁面顯示空白,並且無任何錯誤提示...

android頁面切換空白問題

問題 當切換到第三個fragment時返回到第乙個,第乙個fragment頁面空白。原因 viewpage缺省會載入三個頁面,當切換到第三個時會把第乙個銷毀,再返回時重新呼叫啦oncreateview方法。解決 1.直接設定快取的數量 setoffscreenpagelimit 將快取的數量設定為f...