实现步骤
准备2张图片，一个在上一个在下
上方的图片不动，下方的图片先翻转180°,并隐藏
记录上方与下方图片的起始角度,上方起始角度为0,下方起始角度为180°
使用定时器累加角度,两张图片同时翻转...当上方的图片翻转到90度时,隐藏该图片,显示下方图片
当上方图片翻转到180度时,停止定时器,并还原记录的起始角度
第二次翻转,正反面角色互转即可
使用说明
// ...获取两张图片后调用该方法
turnCardAnimate...) {
if (turnCardAnimate.isTurned){ // 已经旋转过,将两个对象互转
// 取反
var temp = up;
up = down;
down = temp;
}
var...) {
// 翻转每次加1度
upDeg += 1;
downDeg += 1;
// 同时翻转2张图片
// 当上面的图片翻转到90度,隐藏上面,显示下面的图片
if(upDeg >= 90){
}...// 当上面的图片翻转到180度,初始化设置,清除定时器,并记录是否旋转
if (upDeg >= 180){
clearInterval(main.timer);
downDeg = 180;
upDeg
云服务器
ICP备案
云直播
对象存储
实时音视频
