偶然之间发现掘金个人中心的头像移上去的时候会旋转,并且旋转速度越来越来越快,然后我一开始不知道怎么做,在看了css3的时候才发现也不是很难嘛所以就试了一个
掘金原效果:
好像会出问题,所以后面效果图就不放了,大家可以替换图片看一下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
.routeImg{
width:80px;
height:80px;
border-radius: 50%;
border:2px solid grey;
}
.routeImg:hover{
transform: rotate(666turn);
transition-duration: 59s;
transition-timing-function: cubic-bezier(.34, 0, .84, 1)
}
</style>
</head>
<body>
<img class="routeImg" src="img/a.jpg" alt="">
</body>
</html>