日本免费高清视频-国产福利视频导航-黄色在线播放国产-天天操天天操天天操天天操|www.shdianci.com

學(xué)無(wú)先后,達(dá)者為師

網(wǎng)站首頁(yè) 編程語(yǔ)言 正文

transition transform屬性造成文字抖動(dòng)及模糊的解決方法

作者:我總是詞不達(dá)意 更新時(shí)間: 2022-09-22 編程語(yǔ)言

在動(dòng)畫的transform里加上translateZ(0)值, 能解決文字抖動(dòng)的問(wèn)題,但是沒能解決文字模糊的問(wèn)題。
在使用transition transform發(fā)生文字模糊的地方加上transform: translate3d(0,0,0),解決文字模糊以及的問(wèn)題。

<van-icon name="arrow-down"
          color="#9599d4"
          style="transition: transform 0.3s; transform: translate3d(0, 0, 0)"
          :class="setIconStyle(true)" />
//動(dòng)態(tài)設(shè)置角色列表的圖標(biāo)樣式
setIconStyle() {
    return function(val) {
        return val ? 'negative-rotate': 'positive-rotate'
    }
},
.positive-rotate {
  transform: rotate(0deg) translateZ(0)
}

.negative-rotate {
  transform: rotate(-180deg) translateZ(0)
}

原文鏈接:https://blog.csdn.net/weixin_43743175/article/details/126753256

欄目分類
最近更新