2

好的。我有一个固定位置标题，其中包含一个导航，其中三个绝对定位的 li 元素在内联显示。这些标签旨在触发以下脚本并滚动到适当的锚点：

 <script>
 function goToByScroll(id){
        $('body, html').animate({scrollTop: $(id).position().top},'slow');
 }


 $mainNavLiA.click(function(e) {
       e.preventDefault();
       var $parent = $(this).parent();
       if ($parent.hasClass("active")) {
           return;
       };

       $mainNavLi.removeClass("active");
       $parent.addClass("active");

       var $destination = $(this).attr("href");

       goToByScroll($destination);
  });

  </script>
  <style>


#header-container {
  width: 100%;
  height: 20%;
  min-height: 96px;
  max-height: 130px;
  position: fixed;
  z-index: 2000;
  top: 0;
  left: 0;
}
#header-container header {
  width: 100%;
  height: 100%;
  margin: auto;
}
#header-container header nav {
  width: 100%;
  height: 67px;
}
#header-container header nav ul {
  height: 67px;
  width: 100%;
}
#header-container header nav ul li {
  display: inline-block;
  opacity: .75;
 }
#header-container header nav ul li.home {
  width: 27.5625%;
  height: 63px;
  position: absolute;
  left: 0;
  right: 73.125%;
}
#header-container header nav ul li.home a {
  display: block;
  width: 100%;
  height: 100%;
}
#header-container header nav ul li.work {
  width: 28.6875%;
  height: 63px;
  position: absolute;
  left: 29.4375%;
  right: 41.5%;
}
#header-container header nav ul li.work a {
  display: block;
  width: 100%;
  height: 100%;
}
#header-container header nav ul li.contact {
  width: 40.8%;
  height: 63px;
  position: absolute;
  left: 59.6875%;
  right: 0;
}
#header-container header nav ul li.contact a {
  display: block;
  width: 100%;
  height: 100%;
}

</style>

在我的桌面上，脚本运行良好。但是，当我在 iphone 上测试时，脚本仅在页面位于最顶部时触发。在这一点上，我被难住了。

附带说明一下，是否有任何地方具有类似于 IOS 的 Safari 和 Chrome 检查器的“检查元素”功能？

谢谢！

4

0 回答 0