还是围绕着那个下拉框的动画效果
对于这样的一个效果,很明显我们要把下拉框隐藏,然后给a标签加事件,js点击的时候,慢慢的出现下拉框。
如果是以前的话我肯定是直接在css中直接把下拉框给隐藏了,但是这次写着写着突然发现这个隐藏应该是由js来实现的,因为只有这样,当用户没有禁用js的时候,我们的js可以动态的隐藏这个下拉框,他点击的时候再慢慢的出现。但是,当我们的部分用户禁用了js的时候,此时由于我们的隐藏css是由js动态的设置的,所以此时我们的下拉框就无法被隐藏,于是我们的用户虽然禁用了js,但是他们仍然可以看到我们的下拉框,做到了平稳退化。
简要的代码实现:
html结构
css样式
js动态隐藏下拉框