Background animation does not work on Microsoft Edge

Asked

Viewed 60 times

0

I tested the code on Chrome and it worked normally, someone knows what that is??

body{
	background-image: url("blo.jpg");
	background-position: center center;
	background-attachment: fixed;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	animation-name: animac;
	animation-iteration-count: infinite;
	animation-duration: 60s;
}
@keyframes animac{
	0%{
		background-image: url("blo.jpg");
	}
	20%{
		background-image: url("bla.jpg");
	}
	40%{
		background-image: url("ble1.jpg");
	}
	60%{
		background-image: url("bli.jpg");
	}
	80%{
		background-image: url("ble.jpg");
	}
	100%{
		background-image: url("blo.jpg");
	}
}

1 answer

1


You are using the Web Animations API to create your animations. It is not yet standard for all Browsers, as can be seen here. Microsoft is still considering inserting it in future versions of Edge.

If it is really necessary for your project, you can include the API in your project to use its resources. The Web Animations API Project is available on github. I hope I’ve helped.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.