<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>无缝轮播</title>
<style>
.div1{
width: 770px;
height: 300px;
overflow: hidden;
margin: auto;
position: relative;
}
@keyframes anis {
100%{transform: translate(-4620px)}
}
img{
position: absolute;
}
.div2{
animation: anis 20s linear infinite;
}
.div2:hover{
animation-play-state:paused;
}
</style>
</head>
<body>
<div class="div1">
<div class="div2">
<img style="left: 0;" src="../../img/ad7.jpg" alt="">
<img style="left: 770px;" src="../../img/ad1.jpg" alt="">
<img st
HTML5 animation 无缝轮播
最新推荐文章于 2023-06-07 16:23:59 发布