浏览器不断下载CSS背景图片

时间:2019-08-25 08:54:30

标签: css performance google-chrome download

浏览器一直在下载我的svg背景图片。这是在我的网站上循环播放的CSS动画。

我进行了屏幕录像以显示问题:https://share.getcloudapp.com/L1uzRzRo

因为svg已被缓存,所以这不是什么大问题。但是,网站满载+1000秒似乎有点奇怪

body {
  min-height: 100vh;
  margin: 0;
  position:relative;
  overflow:hidden;
}
body:before {
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
  background-image: url(https://www.turbotobias.dk/wp-content/uploads/2019/03/Fly-med-banner-TurboTobias-Graphics2.svg);
  background-position:center;
  background-size:400px auto;
  background-repeat:no-repeat;
  animation:slideLeft 5s linear infinite;
  
}


@keyframes slideLeft {
  from {
    transform:translateX(100%);
  }
  to {
    transform:translateX(-100%);
  }
}

1 个答案:

答案 0 :(得分:0)

我发现这不是代码问题,而是VS代码本地主机的问题...每当我将代码带入实时服务器环境时,问题便得到解决。