当鼠标 hover 到家用电器上面
来源：1-5 按需加载商品详情
爱吃夜宵的前端Student
2020-09-18 12:27:20
如果这时候 animation:‘slideLeftRight’
那么dropdown-layer 里面的文字内容（也就是category-details手机通讯等，）这些文字的出现和背景的从左到右展开是不同步的，我在Chrome浏览器上测试：
1. 发现展开的时候是文字先出现，随后背景再慢慢展开，
2. 收回的时候是背景先收回，文字再消失
我有一点印象记得老师讲过文字和背景不同步的问题，但是不记得怎么做了，所以这个该怎么解决呢？
写回答
1回答
-
好帮手慕久久
2020-09-18
同学你好，文字和背景色不同步是因为文字是立即显示出来，而背景是渐变显示的。老师给你提供两个解决方案供参考：
给文字添加透明度渐变效果，即让文字也渐变出现，从而解决该问题。
还可以尝试设置文字是隐藏的，等背景色全部显示出来时，再让文字显示，即背景色显示时，会有一个标志性的类名，比如“.slideLeftRightCollapse”，那么我们就可以给这样设置文字“.slideLeftRightCollapse .category-details{display：block；}”(category-details是文字所在的父元素）。
如果我的回答帮到了你，欢迎采纳，祝学习愉快！
0
相似问题