我准备了2个图片，另外一个图片是fanmian.jpg。怎么点击正面的图片，翻转成反面的图片<!DOCTYPE html><html><head><meta charset="UTF-8"><title>图片翻转</title><style type="text/css"></style></head><body><img src="zhengmian.jpg"></body></html>
1 回答
已采纳
慕运维7130634
TA贡献41条经验 获得超18个赞
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
*{
margin: 0;
padding: 0;
}
img{
width: 311px;
height: 168px;
margin: 0 auto;
display: block;
}
@keyframes gogogo{
from{transform: rotateY(0)}
to{transform: rotateY(360deg)}
}
.active{
animation: gogogo 2s ease-in;
}
</style>
<meta charset="utf-8" />
</head>
<body>
<img id="img" src="img/images/cp5.jpg" />
<script>
var img=document.getElementById("img");
img.onclick=function(){
this.className="active";
var _this=this;
setTimeout(function(){
_this.src="img/images/cp6.jpg";
},1950)
}
</script>
</body>
</html>
添加回答
举报
0/150
提交
取消