Javascript Click.function不工作

我不熟悉javascript，但现在我需要使用javascript进行导航。导航应该是这样的。

如果单击“主页”，主页“按钮”应向右移动一点。然后，当您单击“关于我”按钮时，主页按钮应返回，关于我按钮将向右移动…依此类推，导航的其余部分。每次你点击一个按钮，它就会向右移动，一旦你点击另一个按钮，它就会返回，这个按钮就会向右移动

我还没有输入正确的px编号，但我已经为它构建了javascript代码，这给我带来了问题。当我点击“Home”时，footer div（底部的黑色条）正在移动，而不是Home div。我不知道如何解决这个问题。一旦我完全删除了footer div，当我点击它时，什么都没有发生。 也许有人能帮我

我不知道您是否也需要CSS代码，但到目前为止，这里是javascript和html代码

$(window).load(einblenden);

function einblenden(){
$("#navi_home").click(moving1); 
}

function moving1(){
$("div").animate({"right":"500px"},300);
$("#navi_home").animate({"right":"200px"},300);
inhalt(1); }


function inhalt(nr){
$("#inhalt").load("seite"+nr+".html", function(){ $(this).fadeOut(0).fadeIn(600);});
}

还有html

  <div id="wrapper">

  <div id="logo">
        <a href="index.html"><img src="img/logo.png" alt="logo" /></a>
    </div> <!-- End Logo -->

    <div id="navi_home">Home</div>
    <div id="navi_about">About me</div>
    <div id="navi_portfolio">Portfolio</div>
    <div id="navi_contact">Contact</div>


    <div class="clear"></div> 

<div id="content">

  <p id="inhalt"> </p>

  </div> <!-- End Content -->

<div id="footer">

  </div> <!-- End Footer -->

   </div> <!-- End Wrapper -->

家
关于我
文件夹
接触

试试类似的方法。将nav按钮类添加到html中的每个按钮将使将行为应用于所有按钮变得更容易。我还关闭了

$（窗口）.load（）

for

$（函数（）{}）

，它是

$（document.ready（）

的别名。我不确定您试图用

$（“div”）

实现什么，但此代码仅在单击时为任何导航按钮的左边距设置动画：

$(function () { 
    einblenden();
});

function einblenden() {
    $(".nav-button").click(function() {
        $(".nav-button").animate({"margin-left":0},300);
        $(this).animate({"margin-left":200},300);
        inhalt(1);
    });
}

function inhalt(nr) {
    $("#inhalt").load("seite"+nr+".html", function(){ $(this).fadeOut(0).fadeIn(600);});
}

---

我怀疑您的$（“div”）选择器是导致您出现问题的原因。如果在moving1（）中只有$（“navi）home”）.animate（）？@wendelbsilva:The$（“#navi_home”）。单击（moving1）；已经是其中的一部分了。所以当我想点击时，我应该把动画的设置放在哪里（比如把它放到右边200px？）$（“navi_home”）。点击（{“right”：“200px”}，300）@JoshuaBrodie虽然我认为它也是$（div），但我已经尝试删除它，但什么也没有发生。请为接下来的问题保持代码清晰。非常感谢。现在它至少在做一些非常有用的事情。但它仍然没有做它应该做的事情。就像你在这里看到的那样：我想要的是当你点击“主页”时，主页按钮会转到右边。当你点击“关于我”时，“主页”按钮返回，而“关于我”按钮向右推…以此类推。。你的html似乎有一些时髦的格式，动画都弄乱了。如果你愿意，我可以试着让它在你的手机上运行，但这需要更多的时间。是的，就像它应该看起来的那样。不过，我的文件仍然无法正常工作。但是javascript看起来已经很容易理解了。我是否仍然可以添加一个不同的“inhalt函数”（这是单击按钮时附带的内容），或者它们现在都将以“inhalt（1）”打开？但如果你能帮我让它为我工作，那就太好了。我真的很感激。看看这个：。现在他们都会加载同一个页面，但开始工作并不困难。我建议为每个导航按钮添加一个

data page=“yourPage.html”

属性，然后在单击按钮时将该值传递给inhalt，就像

inhalt（$（this）.attr（'data-page'））

。这就是说，有许多其他的方法来浏览动态内容，你可能想四处看看，或者找到一个教程。哇，它真的很管用。非常感谢你的帮助。看到你们把导航列成一个列表真是令人惊讶，因为我就是这样开始的，直到我把它改成了单div。但看看你改变了什么，我终于明白了。我通常要看一次“完成”的东西（我找不到这个导航的教程），来了解如何做，以及一切是如何工作的，我真的很感谢你花时间来帮助我。我现在应该可以自己解决剩下的问题了。：）非常感谢。