zoukankan      html  css  js  c++  java
  • CSS3过渡

    Transition

    1.允许css的属性值在一定的时间区间内平滑地过渡
    2.在鼠标单击、获取焦点、被点击活对元素做任何改变时触发,并圆滑地以动画效果改变css的属性
    存在兼容性问题:IE10+ 、FireFox16+、Chrome26+、Safari6.1+、Opera12.1+


    属性

    1.transition-property
    检索活设置对象中参与过渡的属性 参数取值 none(没有属性改变) | all(所有属性改变)默认值 | property(元素属性名)
    2.transition-duration
    检索或设置对象过渡的持续时间 参数取整 time 举例 transition-duration:2s 单位是秒或者毫秒计
    3.transition-timing-function
    检索或者设置对象中过渡的动画类型
    参数说明:
    linear:线性过渡
    ease:平滑过渡
    ease-in:由慢到快
    ease-out:由快到慢
    ease-in-out:由慢到快再到慢
    step-start 等同于steps(1,start)
    step-end 等同于 steps(1,end)
    steps([,[start|end]]) 第一个参数指定函数的步数,第二个参数指定每一步的值变化的时间点,默认为end
    4.transition-delay
    检索或设置对象延迟过渡的时间
    参数:time
    指定秒或毫秒之前要等待切换效果开始
    默认为0
    5.复合使用
    transition:property duration time-function delay;

  • 相关阅读:
    redis中插入用户集合的语句,有四个属性
    springmvc的执行流程
    面试问题总结
    程序员
    RESTFUL
    京东京麦商家开放平台的消息推送架构演进之路
    stark组件开发之自动生成URL
    stark组件前戏之项目启动前加载指定文件
    权限分配实现思路
    批量操作权限的页面展示
  • 原文地址:https://www.cnblogs.com/wangxuxu7912/p/11375834.html
Copyright © 2011-2022 走看看