element-ui+umy-ui表格在設置固定列后,鼠標滑輪滾動時固定列與普通列錯位問題(滾動完成后正常)(滾動遲鈍、遲滯問題)(background-blend-mode)


問題描述

在使用element-ui+umy-ui表格時候,設置了固定列,鼠標滑輪滾動會導致固定列與普通列錯位(在谷歌瀏覽器會出現這個問題,360是正常的),就像遲鈍一樣,鼠標在固定列滾動時,固定列先動,普通列遲鈍一會跟上,反之亦然,如下圖

在停止滾動后,界面恢復正常,又變回對齊的狀態:

監聽滾動,得到的表格偏移量也是一致(element中固定列的實現方式是再加一個表格)

解決辦法

在設置滾動的樣式類中加background-blend-mode樣式,我試了一下,不設置成Nomal基本都可以

不會找相應類的,可以把選擇樣式的指向滾動條,基本都可以找到這個容器。
原因:出現問題的原因我其實沒有去研究,可能是兩個表格滾動時,背景不疊加導致的動態視覺錯位。如果有朋友知道是什么問題導致的,評論區可以告訴我喲,謝謝啦。

background-blend-mode:就是背景的混合模式,可以將兩張圖片疊加在一起,我看別人很多用於動態制作。
描述
normal 默認。把混合模式設置為普通。
multiply 把混合模式設置為 multiply(乘)。
screen 把混合模式設置為 screen(屏幕)。
overlay 把混合模式設置為 overlay(覆蓋)。
darken 默認。把混合模式設置為普通。
lighten 把混合模式設置為 lighten(變亮)。
color-dodge 把混合模式設置為 color-dodge(顏色減淡)。
saturation 把混合模式設置為 saturation(飽和度)。
color 把混合模式設置為 color(顏色)。
luminosity 把混合模式設置為 luminosity(亮度)。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM