滑動菜單使用JavaScript

Question

我有點卡住...

在此請看：

http://jsfiddle.net/matiitas/Lgtv5/1/

下面你可以找到的JavaScript代碼的一部分：

var stopPosition = 860; 
var slidingDiv = ""; 
var slidingDiv2 = ""; 

window.onload = function() { 
    document.getElementById("option").onclick = slideIt; 
    slidingDiv = document.getElementById("content"); 
    document.getElementById("back").onclick = slideIn; 

    document.getElementById("option2").onclick = slideIt2; 
    slidingDiv2 = document.getElementById("content2"); 
    document.getElementById("back2").onclick = slideIn2; 
}; 

function slideIt() { 
    if (parseInt(slidingDiv.style.left) < stopPosition) { 
     slidingDiv.style.left = parseInt(slidingDiv.style.left) + 2 + "px"; 
     setTimeout(slideIt, 1); 
     active = true; 
    } 
} 

我使用javascript創建滑動菜單，但我有3個主要問題：

1. 我該如何重用代碼，因此我不必一遍又一遍「重複」這些函數？
2. 我想菜單「家」隱藏菜單「服務」被點擊，反之亦然。
3. 我想有類似有兩種行爲...當它被點擊，第一次到內容滑動，當它再次點擊隱藏內容...

Answer 1

1 - 喜歡的東西這個？

function slideIt(divToSlide) { 
    if (parseInt(divToSlide.style.left) < stopPosition) { 
     divToSlide.style.left = parseInt(divToSlide.style.left) + 2 + "px"; 
     setTimeout(slideIt, 1); 
     active = true; 
    } 
} 

不確定在做什麼活動。

2 - 將所有動畫元素推送到數組中。當你展開一個，摺疊其他人。

function slideIt(divToSlide) { 
    for(var d in slidingDivs) { 
     if(d != divToSlide) collapseDiv(d); 
    } 

    ... 
} 

3 - 有幾種方法可以解決這個問題。跟蹤狀態並檢查點擊處理程序中的狀態。