cannon vid
<!DOCTYPE html>
<html>
<head>
<meta charset=”utf-8″>
<title>Media Gif Cannon Vid</title>
<style media=”screen”>
.cannon{
width:1050px;
animation:cannon;
animation-duration:0.7s;
background-image:url(mediagifcannon1.png);
background-image:url(mediagifcannon2.png);
background-image:url(mediagifcannon3.png);
background-image:url(mediagifcannon4.png);
background-image:url(mediagifcannon5.png);
background-image:url(mediagifcannon6.png);
background-image:url(mediagifcannon8.png);
background-image:url(mediagifcannon9.png);
}
@keyframes cannon{
0%{background-image:url(mediagifcannon1.png)}
15%{background-image:url(mediagifcannon2.png)}
30%{background-image:url(mediagifcannon3.png)}
45%{background-image:url(mediagifcannon4.png)}
65%{background-image:url(mediagifcannon5.png)}
80%{background-image:url(mediagifcannon6.png)}
90%{background-image:url(mediagifcannon8.png)}
100%{background-image:url(mediagifcannon9.png)}
</style>
</head>
<body>
<div class=”cannon”>
<img src =”mediagifcannon1.png”>
</div>
</body>
