扒皮下騰訊網站地圖頁面頁卡的滾動特效

今天要扒的是騰訊網站地圖頁面（http://www.qq.com/map/）頁卡滾動效果，見下圖 有興趣的童鞋可以去那頁面試一試，其動畫效果見下圖： 那麼先理下思路：上方的按鈕對應下方的某個欄目，點擊某按鈕時，其對應的欄目（暫且稱爲A吧）滾到最上方，原本在A前方的欄目則在滾動結束後自動跳到最後面（這裏要注意順序，比如在A前面有2個欄目B和C，那麼B滾完便跳到最後，然後C開始滾，C滾完跳到最後面）。

>>阅读原文<<