首页 文章

链接无法点击，只能在移动设备上长按

提问于
浏览 次
0

我在Wordpress网站上有一个奇怪的错误，我已经接管了（我没有开发它，而且代码有点混乱） .

如果我调整桌面浏览器的大小，移动导航工作正常，但如果我在iPhone上访问它，则链接无法点击 . ARE可长按（例如，我可以在新标签中打开），但点击它们在我的iPhone上，在Safari和Chrome中都不会做任何事情 .

还有其他人遇到过这个问题吗？

我正在工作的我的临时服务器在这里：frame.staging.wpengine（尽管它在主站点上也被破坏了，并且一直用于我不知道多长时间） .

HTML（检查时）是：

<div id="mobile-nav" style="display: block;">

    <div id="mobile-nav-button0" style="transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 20.0001, 0, 0, 1);">
        <a href="https://blog.frame.io/">BLOG HOME</a>
    </div>
    <div id="mobile-nav-button1" style="transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 20.0001, 0, 0, 1);">
        <a href="https://blog.frame.io/2017/02/09/manifesto">MANIFESTO</a>
    </div> 
    <div id="mobile-nav-button2" style="transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 20.0001, 0, 0, 1);">
        <a href="#footer-email-wrapper">SUBSCRIBE</a>
    </div>
    <div id="mobile-nav-button3" style="transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 19.9992, 0, 0, 1);">
        <a href="https://frame.io/">VIDEO REVIEW TOOLS</
    </div>

</div>

当我打开移动导航时，javascript会添加style =“transform ...” .

以下是适用于#mobile-nav的css规则 .

#mobile-nav {
    position: absolute;
    right: 0px;
    padding-top: 45px;
    width: 50%;
    font-family: AzoWeb-Bold;
    font-size: 16px;
    color: white;
    text-align: left;
    line-height: 36px;
    overflow: hidden;
    display: none;
    height: 100%;
    background-color: #2e323f;
}

菜单“hamburger-menu.js”有一个js文件，但它有1600行：/如果没有挖掘所有的javascript就没有任何东西可以被识别出来，我想我可能不得不把它丢弃并构建我自己的（更简单）移动导航栏 .

css wordpress mobile

1 回答

  • 0

    我在移动视图中找到了你site . 每次我点击链接 . 此警告显示在控制台中：

    Unable to preventDefault inside passive event listener due to target being treated as passive. See https://www.chromestatus.com/features/5093566007214080

    似乎正在发生的是你有一些jquery阻止锚标记导航 . 仅限移动设备 . 我试图追踪你的JS，但它已经缩小了 .

    希望能帮助您调试 . 干杯 .

    回复于

相关问题