尝试创建菜单切换

Question

我正在尝试使用隐藏和显示功能在桌面移动设备上创建一个菜单切换，但我无法这样做。

Rootobject data2 = JsonConvert.DeserializeObject<Rootobject>(dataString);

$(document).ready(function() {
    $("#menuMobileToggle").click(function() {
        $(".CategoryList").slideToggle(700);
    });
});

Answer 1

好像你的代码不完整，你必须包含jquery库。检查下面的代码段。

$(document).ready(function() {
  $("#menuMobileToggle").click(function() {
    $(".CategoryList").slideToggle(700);
  });
});

.CategoryList {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="top-nav">
  <a href="#" id="menuMobileToggle">Menu</a>
  <div class="clear"></div>
  <div class="CategoryList" id="TopCategoryList">
    <div class="SideCategoryListClassic">
      <nav>
        <ul class="category-list" style="padding-top: 3px;">
          <li class=""><a href="/motorcycle-tire-warmers">MOTO-D Tire Warmers</a></li>
          <li class=""><a href="/pro-series-motorcycle-stands">MOTO-D Stands</a></li>
          <li class=""><a href="/cnc-motorcycle-parts">Bonamici Rearsets</a></li>
          <li class=""><a href="/motorcycle-gps-lap-timer">MOTO-D "Next" GPS Lap Timer</a></li>
          <li class=""><a href="/motorcycle-undersuits-and-baselayers">MOTO-D Undersuit</a></li>
          <li class=""><a href="/spark-italy-exhaust-technologies">Spark Italy Exhausts</a></li>
          <li class=""><a href="/performance-riding-motorcycle-accessories">Accessories</a></li>
        </ul>
      </nav>
    </div>
  </div>
</div>