这是电脑上显示的 上下箭头都是正常的
这是手机上 上下箭头只显示上箭头
wxml代码如下:
<!--下拉上滑按钮-->
<cover-view class="down_up" bindtap="down_up">
<cover-image class="up_img {{down==1 ? 'down_img' : ''}}" src="../images/up.png"/>
</cover-view>
<!--end下拉上滑按钮-->
wxss代码如下:
/* 骑行详情下滑上拉按键开始 */
.down_up{
width:100%;
height: 80rpx;
display: flex;
flex-direction: row;
justify-content: center;
}
.down_up .up_img{
width:80rpx;
height:80rpx;
margin: 0 auto;
}
.down_img{
-webkit-transform:scaleY(-1);
transform:scaleY(-1);
}
/* 骑行详情下滑上拉按键结束 */
js代码如下:
//骑行详情页面,控制上拉下滑显示
down_up:function(){
var that = this
var down = (that.data.down == 1) ? 0 : 1
that.setData({
'down':down
})
},
咦,真机不行吗?不行换rotate吧。。再不行就换动画吧,动画肯定行,我用了的
rotate translate都试了不行 动画怎么用的😄
不会吧。。我去试试去。。稍等。。
在线等!!!😄
官方说。2.1.0开始 cover-view是支持的哎。然后我试了下,我微信版本是 6.7.0。确实还没效果。。坐等官方解释
tip
: 基础库 2.1.0 起支持设置scale
rotate
的css样式,包括transition动画还有其他办法吗?