关于平稳退化的一个实践

时间:2021-01-15 08:15:03

还是围绕着那个下拉框的动画效果

关于平稳退化的一个实践

对于这样的一个效果,很明显我们要把下拉框隐藏,然后给a标签加事件,js点击的时候,慢慢的出现下拉框。

如果是以前的话我肯定是直接在css中直接把下拉框给隐藏了,但是这次写着写着突然发现这个隐藏应该是由js来实现的,因为只有这样,当用户没有禁用js的时候,我们的js可以动态的隐藏这个下拉框,他点击的时候再慢慢的出现。但是,当我们的部分用户禁用了js的时候,此时由于我们的隐藏css是由js动态的设置的,所以此时我们的下拉框就无法被隐藏,于是我们的用户虽然禁用了js,但是他们仍然可以看到我们的下拉框,做到了平稳退化。

简要的代码实现:

html结构

 

关于平稳退化的一个实践

 

 

 

css样式

 关于平稳退化的一个实践

js动态隐藏下拉框

关于平稳退化的一个实践