html - Slideshow/Changing background image

Question

I'm trying to set my page background image to be a slideshow of multiple images but I can't figure out a way to change the url of the image at a given interval while also using a fade in/out transition.

html {
background: url("mare.jpg") no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

标签： htmlcssurlbackground

Answer 1

您可以使用 JS 脚本更新 DOM

例如，您可以使用以下脚本更新您的身体标签：

<script>
  document.body.style.background = "url("mare.jpg") no-repeat center center 
</script>