Question

我的网站上有两个页面，都使用完全相同的CSS，完全相同的jQuery代码，以及完全相同的HTML（至少用于导航）。

在iPhone上，第一页的汉堡包导航工作 - 当用户触摸汉堡包图标并打开菜单时，它会展开。当用户触摸汉堡包图标时，第二页不起作用。正如我所说，他们都使用相同的CSS，jQuery和HTML。

为了让这个在第一页上起作用，我使用了光标：指针，因为我读过的是其他人的工作。它有效，但只在一页上。

适用于Chrome和Firefox以及我制作的小提琴。唯一不起作用的地方是iPhone。

任何想法我做错了什么？我把头发拉过来。

第1页的小提琴：https://jsfiddle.net/kiddigit/eeq618ku/1/ 第2页的小提琴：https://jsfiddle.net/kiddigit/yLuLe0c2/1/

HTML

<header>
  <h1><a href="header.html">Malt and Mold</h1></a>
  <nav>
    <a href="#" class="hamburger">
      <div class="line"></div>
      <div class="line"></div>
      <div class="line"></div>
    </a>
    <ul class="clearfix menu">
      <li><a href="header.html">Home</a></li>
      <li><a href="page3.html">Gift Baskets and Catering</a></li>
      <li><a href="page8.html">Tasting Calendar</a></li>
      <li><a href="page7.html">Membership</a></li>
      <li><a href="page8.html">Special Events</a></li>
      <li><a href="page9.html">Contact</a></li>
    </ul>
  </nav>
</header>

的jQuery

$('.hamburger').on('click', function(e) {
  e.preventDefault();
  $('.menu').toggleClass('slide-down');
});

带游标的CSS：添加了指针

* {
    cursor: pointer;
}

ul a {
  display: block;
  padding: 10px;
  font-size: 13px;
  font-weight: bold;
  text-align: center;
  color: black;
  cursor: pointer;
  text-decoration: none;
}

为什么我的jQuery点击只能在一个页面上工作（使用iPhone时）？

0 个答案: