为什么transition不能改变透明度?

codepen上的代码

一点疑惑,为什么我在 .list>li 中设置了透明度没有生效,我想设置

        .list>ul{
            // -webkit-transform:scale(.8) translateY(-20%);
            opacity:.6;
            transition:all .5s .2s ease;
            // transform:translateY(10%);

        }
        .normal{
            transform:scale(1.1) translateY(10%);
            opacity:1;
            //transform:scale(1) translateY(10%);
        }

开始时缩放0.8,transition之后变成1,开始设置translateY(20%),之后变成translate(0%),如何做?

阅读 7.5k
3 个回答

代码有问题

.list>ul {
    opacity: .6;
    transition: all .5s ease;
    transform: scale(0.8);
}
.normal {
    transform: scale(1);
    opacity: 1;
}

.list>ul 设置的是初始化的状态,需要用js把normal添加到ul上才能看到效果

transition 可以透明度吧! 1-0.1

图片描述

数值类的属性都可以过渡的,js给 ul 添加 .active 触发动画

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题