要求實現的動效：左邊每一條li滑鼠經過的時候，藍色框從左邊滑進，右邊圖片從右邊滑進

出現的bug：hover上一個li，文字的變白速度比滑出條速度快，出現一瞬間的閃現效果（或者說完全消失）

藍色條是從左滑出的，使用的是jq+animate.min.css

$("li").hover(function(){

    $(this).find($(".bg--blue")).addClass("animated fadeInLeftBig");

})

但是文字變白的這樣的

li.active>a,

li.active>a:hover,

li.active
 
>a:focus{

    color:#fff;

}

考慮到，有可能是css上的hover之後發生的時間比jq的hover()的時間快，或者也有原因是animated或者fadeInLeftBig已經加上時間延遲
翻看animate.mim.css的原始碼

於是我們可以這樣做
解決：

li.active>a{

    color:#fff;

    transition:all 1s;/*這裡秒數自己加*/

}

li.active>a:hover,

li.active>a:focus{

    color:#fff;

}

效果：可以看出字型的顏色是漸變成白色的而不是沒有任何緩衝時間變白色