今天做項目,偶然發現自己用的AdminLTE框架左側側邊欄展開、關閉時小箭頭不會動。如圖所示:
瞭解官網後發現,人家的卻是這樣的:
爲了解決這個問題,於是我和這個bug展開了半個小時的鬥爭,一定要把它解決!!!
step 1:一開始以爲它是js控制的,於是取adminlte.js中查找,當我打開js文件時:一臉茫然。·_· !!! 密密麻麻的js,不想看。失敗
step 2:想想算了,不要要麻煩,直接這樣看下去今晚註定無眠!於是直接將官網的js替換項目中的js。三步兩步操作完成,結果“列表都展不開了”,什麼鬼呀。失敗
step 3:再回過頭來想一想,css也有動畫呀,爲什麼不檢查一下元素樣式呢?時間流逝,時間流逝......參看二者界面的css樣式,得到一個小發現,請看下圖:
官網,正常:
我的網站,不正常:
經過我仔細的觀察,發現我這個版本的css樣式寫錯了!!!!!!該版本的css寫錯了!!!!
.sidebar-menu li.active>a>.fa-angle-left>a>.pull-right-container>.fa-angle-left
這句是什麼鬼東西呀!!作者老哥!
改正選擇器,選中小箭頭,問題解決。
當我滿心歡喜準備關閉頁面的時候,測試幾下,發現沒有動畫。
這下好辦,直接給dom對象加上animation,最終大功告成!!!!
真是一場心累之旅。。。。微弱強迫症,唉。
不過,給自己的堅持不懈加加油!