【发布时间】:2016-03-24 23:16:36
【问题描述】:
我试图弄清楚为什么这个响应式菜单可以在 iPhone 和其他平板电脑上正常工作,但在 iPad 上却不行。在手机上,单击菜单图标时,菜单被激活并正确下拉。但是,在 iPad 上,单击菜单图标时没有任何反应。
这是相关的html:
<a href="#" class="nav-toggle" aria-hidden="false">Menu</a>
<nav id="nav" class="nav-collapse closed" aria-hidden="true" style="transition: max-height 250ms; position: absolute;">
<ul id="topnav" class="menu"><li id="menu-item-104" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-7 current_page_item no-children menu-item-104">
<a href="http://bigdogpyro.geeksweet.com/">Home</a></li>
...
</ul></nav>
当通过浏览器开发工具(通过切换设备模式)查看此内容时,作为手机,当单击菜单图标时,它会将 ul 标记中的“关闭”类更改为“打开”(然后出现下拉菜单),但是,作为平板电脑,类不会改变。 (我正在使用开发者工具在我的 Mac 上的 Chrome 中对此进行测试——它通常会在平板电脑上显示此问题,尽管问题似乎特定于 iPad。)
所以,我猜这是一个 javascript 问题,但我不确定如何从这里进行故障排除——我对 javascript 的处理不是很好,并且 Wordpress 主题中的源 javascript 文件是缩小且难以解析。
但是,如果有帮助,下面是页面页脚中包含的脚本:
<script>
var navigation = responsiveNav(".nav-collapse", {
label: "Menu", // String: Label for the navigation toggle
insert: "before", // String: Insert the toggle before or after the navigation
});
</script>
<script>jQuery(document).ready(function($)
{$('.expander').simpleexpand({'defaultTarget': '.sub-menu'});});
有人知道为什么会发生这种情况吗?
【问题讨论】:
标签: javascript css wordpress ipad responsive-design