终于解决了一个bug,AdminLTE版本2.3.6侧边栏显示箭头无动画

今天做项目,偶然发现自己用的AdminLTE框架左侧侧边栏展开、关闭时小箭头不会动。如图所示:

终于解决了一个bug,AdminLTE版本2.3.6侧边栏显示箭头无动画

了解官网后发现,人家的却是这样的:

终于解决了一个bug,AdminLTE版本2.3.6侧边栏显示箭头无动画

为了解决这个问题,于是我和这个bug展开了半个小时的斗争,一定要把它解决!!!

step 1:一开始以为它是js控制的,于是取adminlte.js中查找,当我打开js文件时:一脸茫然。·_· !!! 密密麻麻的js,不想看。失败

step 2:想想算了,不要要麻烦,直接这样看下去今晚注定无眠!于是直接将官网的js替换项目中的js。三步两步操作完成,结果“列表都展不开了”,什么鬼呀。失败

step 3:再回过头来想一想,css也有动画呀,为什么不检查一下元素样式呢?时间流逝,时间流逝......参看二者界面的css样式,得到一个小发现,请看下图:

官网,正常:

终于解决了一个bug,AdminLTE版本2.3.6侧边栏显示箭头无动画

我的网站,不正常:

终于解决了一个bug,AdminLTE版本2.3.6侧边栏显示箭头无动画

经过我仔细的观察,发现我这个版本的css样式写错了!!!!!!该版本的css写错了!!!!

终于解决了一个bug,AdminLTE版本2.3.6侧边栏显示箭头无动画

.sidebar-menu li.active>a>.fa-angle-left>a>.pull-right-container>.fa-angle-left

这句是什么鬼东西呀!!作者老哥!

改正选择器,选中小箭头,问题解决。

当我满心欢喜准备关闭页面的时候,测试几下,发现没有动画。

这下好办,直接给dom对象加上animation,最终大功告成!!!!

真是一场心累之旅。。。。微弱强迫症,唉。

不过,给自己的坚持不懈加加油!