先看Demo便於理解：請大家往這裡看

業務需求：
1. 選單個數不固定，當選單個數長度小於給定範圍寬度，則左右移動控制按鈕不啟用（呈灰色狀態）。
2. 初始未移動，右側按鈕為灰色，左邊按鈕為彩色，提示使用者可以點選左側的移動檢視選單超出給定範圍的部分。
3. 當移動開始，左右按鈕都應為彩色，提示使用者此時可以進行左右兩邊的移動操作。
4. 當移動結束，當前方向的控制按鈕應轉變為灰色，提示使用者此方向選單已經移動結束。
5. 若某側控制按鈕可用，則滑鼠經過此按鈕會有高亮提示。
6. 使用者點選選單會有高亮效果，同時下方內容模組隨選單點選而變化。

在寫這個模組的時候，本來我是打算也用jquery來實現，因為本次專案絕大部分程式都是基於jquery的，如果這個模組用jquery來寫也是相當簡單、快捷的，但偶貌似有段時間沒寫javascrip了，所以橫下一條心，哪怕程式碼再繁瑣點，手指繭再厚點，加班時間再長點，也要用javascript來寫（老本可不能忘啊！）。最後就出了這個javascript版本的，事實上花的時間也不長，呵呵。

有2個需求是我自己想做的，但因為專案時間的問題，我沒有做。首先，移動速度是勻速，如果選單項太多，使用者用起來會不會覺得太慢？我想做個加速運動，這個用jquery寫可就太簡單了 T_T（又提到jq了，說了不提它的啊^&*&@%）。再者，由於目前移動的步長是定死了的，選單移動過程中會出現一個選單一半顯示在外面，一半已經移動進遮罩層，如果使用者剛好要點選這個選單，互動似乎就顯得不夠友好了。如果每個選單寬度固定，可以很容易得到一個移動步長。如果選單不固定怎麼做了（我還沒想好，誰能給我一個思路？）
這兩個需求有空再新增上去。反正基本業務需求已經完成，我就稍稍偷懶一下吧。

需求說完了，說下模組功能構成。該模組功能由兩部分組成，一個是選單移動，另一個是選項卡切換。這次主要是做移動程式，選項卡切換用得是自己寫的一個

Ok，分析部分說完了。就程式本身，我覺得不是什麼很難的東東。就看看左右移動的兩個具體方法：

向左移動：