当前位置: 首页 > news >正文

如何解决微信小程序无法使用css3过度属性transition

由于微信小程序不支持CSS3过度属性transition,所以我们需要利用微信小程序api进行画面过度的展示

首先是官方示例:

wxml:

<view animation="{{animationData}}" style="background:red;height:100rpx;width:100rpx"></view>

js:

Page({
  data: {
    animationData: {}
  },
  onShow: function(){
    var animation = wx.createAnimation({
      duration: 1000,
      timingFunction: 'ease',
    })
 
    this.animation = animation
 
    animation.scale(2,2).rotate(45).step()
 
    this.setData({
      animationData:animation.export()
    })
 
    setTimeout(function() {
      animation.translate(30).step()
      this.setData({
        animationData:animation.export()
      })
    }.bind(this), 1000)
  },
  rotateAndScale: functi

http://www.lryc.cn/news/338755.html

相关文章:

  • 【软件设计师知识点】九、网络与信息安全基础知识
  • 广东省道路货物运输资格证照片回执可手机线上办理
  • 【微信小程序——案例——本地生活(列表页面)】
  • 【设计模式】SOLID设计原则
  • 基于java+springboot+vue实现的智能停车计费系统(文末源码+Lw+ppt)23-30
  • IntelliJ IDEA 2022.3.2 解决decompiled.class file bytecode version:52.0(java 8)
  • C++11 设计模式1. 模板方法(Template Method)模式学习。UML图
  • HarmonyOS实战开发-自定义分享
  • Spring源码刨析之配置文件的解析和bean的创建以及生命周期
  • 如何使用 Grafana 监控文件系统状态
  • 智能革命:未来人工智能创业的天地
  • 4月14日总结
  • kafka---broker相关配置
  • 【Golang学习笔记】从零开始搭建一个Web框架(二)
  • 高精度地图导航论文汇总
  • 【域适应】基于域分离网络的MNIST数据10分类典型方法实现
  • 从零实现诗词GPT大模型:pytorch框架介绍
  • [目标检测] OCR: 文字检测、文字识别、text spotter
  • Windows环境下删除MySQL
  • uniapp:uview-plus的一些记录
  • OLTP 与 OLAP 系统说明对比和大数据经典架构 Lambda 和 Kappa 说明对比——解读大数据架构(五)
  • 步骤大全:网站建设3个基本流程详解
  • 利用Sentinel解决雪崩问题(二)隔离和降级
  • 基于springboot的房产销售系统源码数据库
  • 【MATLAB】基于Wi-Fi指纹匹配的室内定位-仿真获取WiFi RSSI数据(附代码)
  • 深圳晶彩智能ESP32-3248S035R使用LovyanGFX实现手写板
  • 【Spring Boot】深入解密Spring Boot日志:最佳实践与策略解析
  • ISTQB选择国内版,还是国际版呢
  • 头歌-机器学习 第11次实验 softmax回归
  • Qt for MCUs 2.7正式发布