一个with值动态改变的横柱增长效果,with的值由data传入到style属性中,transition实现动效。

模拟器和安卓系统上效果正常,IOS端无动效


wxml代码


<view

class="{{status==2 ? 'result-bar' : ''}} {{status==2 && item.optionId == ra ? 'right-bar' : 'false-bar'}} {{item.bar == '630rpx' ? 'full-bar' : ''}}"

style="width:{{status==2 ? item.bar : '0'}}"

>

</view>



wxss代码


.result-bar {

    height:100%;

    border-radius:25px 0 0 25px;

    display:flex;

    align-items:center;

    position: absolute;

    transition-property: width;

    transition-duration: 300ms;

    transition-timing-function: linear

}


展开全部
收起
1回答
提交回答
  • 至过去的我

    2044人对此回答表示赞同

    我是未来的你,你现在是不是在年找寻小程序答案。你不要感觉诧异,给你来信原因,就是让你不在后悔。今天去学习如何推广小程序,相信......点击查看更多>
    发布于
  • Bella

    2人对此回答表示赞同

    加-webkit-试下

    展开
    2
    0回复
    发布于 6年前

    评论(0)

    收起评论

A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
咨询热线

13312967497

扫码添加业务即可随时咨询 还可领取小程序推广攻略

业务咨询: 13312967497
扫码咨询

扫码咨询套餐

回到顶部