Javascript 转换定时功能不可用'；行不通

第一个问题是它不起作用

转换计时功能

（始终作为

转换计时功能工作：线性

， 第二个问题我想为

转换定时功能设置两个设置

减少窗口大小时的设置
轻松退出
增加窗口大小“线性”时的设置`
有什么办法修理吗


/*=======忽略部分\u开始======*/
* {
保证金：0；
填充：0；
}
html，正文{
身高：100%；
}
身体{
背景色：#eee；
}
.包装纸{
身高：100%；
显示：表格；
宽度：100%；
文本对齐：居中；
边界塌陷：塌陷；
}
标题{
框大小：边框框；
显示：表格行；
高度：50px；
背景色：#eee；
边框底部：1px实心#999；
}
主要{
身高：100%；
显示：表格；
宽度：800px；
保证金：0自动；
背景色：#fff；
填充底部：50px；
}
部分{
显示：表格单元格；
}
/*=======忽略部分\u结束======*/
旁白{
显示：表格单元格；
框大小：边框框；
左边框：1px实心#ccc；
宽度：300px；
盒影：-15px00rgba（51,51,51,5）；
/*__过渡*/
过渡定时功能：缓解；
不透明度：1；
过渡：所有2；
}
/*=======忽略部分\u开始======*/
页脚{
位置：固定；
底部：0；
宽度：100%；
框大小：边框框；
边框顶部：1px实心#999；
显示：表格行；
高度：50px；
背景色：#eee；
}
@媒体屏幕和屏幕（最大宽度：800px）{
主要{
宽度：100%；
}
}
/*=======忽略部分\u结束======*/
@媒体屏幕和屏幕（最大宽度：700px）{
旁白{
盒影：-15px00rgba（51,51,51,0）；
不透明度：0；
宽度：0；
边框：0px实心透明；
字号：0；
}
}

文件
标题
部分
在一边
页脚
第一个问题是，当您将转换属性放置在计时函数下方时，您正在重写计时函数。请尝试以下操作：

opacity: 1;
transition: all 2s;
transition-timing-function: ease-out;

至于根据窗口是在增长还是在收缩使用不同的转换计时函数，我认为这在CSS中是不可能的。您可能需要为窗口编写一个事件处理程序来捕获这些事件，然后添加一个类，您的CSS可以使用该类来了解窗口是在收缩还是在收缩。
您正在重写
tr转换计时功能
值与
转换
速记

将两者合并在一起：

aside {
    ...
    transition: all 2s ease-out;
}

或更改声明的顺序：

aside {
    ...
    transition: all 2s;
    transition-timing-function: ease-out;
}

我是说“任何想法”而不是“任何”