Question

当我点击链接时，我试图让菜单从左侧滑动。我一直关注JSFiddle但没有成功。 div保持在一个位置，不会滑动。根据示例，div应隐藏并单击滑入视图，然后再次单击时滑出。它开始隐藏然后进入视图而不滑动，不会向后滑动。我对jQuery很新，但一直在努力学习。

在我的母版页中，我设置了页面的脚本：

<script src="/Scripts/jquery-1.11.1.js" type="text/javascript" ></script>     
<script type="text/javascript"  >
  $(document).ready(function () {
    $("#click").click(function () {
      $("#slider").toggle("slide", {
        direction: "left",
        distance: 280
      }, 500);
    });
  });
</script>
<a id="click" href="#" runat="server" style="position:relative;top:0px;">Slide</a>
<div id="wrapper">
 <div id="box">
  <div id="slider" runat="server" class=" divColCtr RoundBorder" style="display:none">
   //controls inside here
  </div>
 </div>
</div>

问题是我在母版页上尝试这个吗？我需要为每个页面提供一个菜单，并且不愿意认为我必须添加到每个页面，但如果是这样那么那就没问题了。

Answer 1

您尝试复制的小提琴的要求是：jQuery UI 1.9.2

可以在此处下载：http://blog.jqueryui.com/2012/11/jquery-ui-1-9-2/

在jsFiddle的左侧，您可以看到外部需求/依赖项

在你的jquery引用之后包含这个，它应该没问题。

试试这个代码：

    <script src="http://code.jquery.com/jquery-1.11.0.min.js" ></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js" type="text/javascript" 
></script> 


<script type="text/javascript"  >
  $(document).ready(function () {
    $("#click").click(function () {
      $("#slider").toggle("slide", {
        direction: "left",
        distance: 280
      }, 500);
    });
  });
</script>
<a id="click" href="#" runat="server" style="position:relative;top:0px;">Slide</a>
<div id="wrapper">
 <div id="box">
  <div id="slider" runat="server" class=" divColCtr RoundBorder" style="display:none">
   //controls inside here
  </div>
 </div>
</div>

从左侧切换菜单

1 个答案: