Javascript div的jQuery滑动

所以，我的代码应该把粉红色的div移到位置‘right:10px；’但它并没有起作用。这是它的基本原理。所有答复将不胜感激

HTML: 关于

CSS:

---

您的代码中包含了引人注目的java脚本。我没有使用

onclick

事件，而是在其上放置了一个事件侦听器。You's fiddle上也没有jQuery，所以我在我的

HTML文件

<div id="navBar">
    <button id="aboutButton">About</button>
</div>
<div id="aboutSector"></div>

您的原始代码中有一个

未定义的
错误。如果你想获得乐趣，可以在下一次单击后将其滑回

jQuery

$(document).ready(function() {
    $("#aboutButton").click(function() {
      var right = $("#aboutSector").css("right"), 
          shifter = (right == "10px") ? "0px" : "10px"; 

      $("#aboutSector").animate({ right: shifter }, "fast");
    });
});

.
工作正常！！关键是我们不必仅仅为了查看代码而跟随链接。你的小提琴不包括jquery。你真的应该把代码和小提琴放在一起我真的很蠢。我忘了添加jQuery库的链接。
#navBar {
width: 80%;
height: 40px;
left: 10%;
top: 0px;
position: absolute;
box-shadow: 0 2px 2px -2px black;
}

<div id="navBar">
    <button id="aboutButton">About</button>
</div>
<div id="aboutSector"></div>

$(document).ready(function() {
  $("#aboutButton").click(function() {
    $("#aboutSector").animate({ right: "10px" }, "fast");
  });
});

$(document).ready(function() {
    $("#aboutButton").click(function() {
      var right = $("#aboutSector").css("right"), 
          shifter = (right == "10px") ? "0px" : "10px"; 

      $("#aboutSector").animate({ right: shifter }, "fast");
    });
});