hover效果中的图片预加载

最简单方法就是在css中写一个after,然后背景图也是hover的背景图,最后将这个伪元素丢到看不到的地方

代码如下: 注:使用了less的变量和嵌套语法

     .a{
        background: url("@{imgUrl}OperationsCenter/homePage_ts.webp") no-repeat;
        background-size: 100% 100%;
        &:hover {
          background: url("@{imgUrl}OperationsCenter/homePage_tsa.webp")
            no-repeat;
          background-size: 100% 100%;
        }
        &::after {
          content: "";
          position: absolute;
          left: -500px;
          background: url("@{imgUrl}OperationsCenter/homePage_tsa.webp")
            no-repeat;
        }
      }