滑动菜单使用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 - 有几种方法可以解决这个问题。跟踪状态并检查点击处理程序中的状态。