Animate a background image

Joined
Dec 23, 2021
Messages
5
Reaction score
0
Hi, I have a DIV element and it has a background image. Inside the DIV, there is a headline and a paragrapgh. I want to animate only the background image. So, I did this:

Code:
div {
    background-image:url('images/home-background.webp');
    background-size:cover;
    background-position:center center;
    background-attachment:fixed;
    width:100%;
    padding:50px;
    height:800px;
    box-sizing:border-box;
}
div > background-image {   
  animation: shimmy 3s infinite;
  animation-direction: alternate;
}
@keyframes shimmy {
  0% {
    transform: translate(0, 0);   
  }
  100% {
    transform: translate(20px, 50px);
  }
}

It is not working. No doubt I'm doing it wrong. Can someone help me? I just want to animate the background image only.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,813
Messages
2,569,696
Members
45,481
Latest member
Arnulfo32P

Latest Threads

Top