javascript - 响应式设计和 .click() 事件监听器的问题

Question

所以我拥有的是一个完整的 HTML/CSS 网站，这不是我设计的，我只是继承了它。我目前面临的问题是，特别是在一个页面上，当在手机/平板电脑上查看时，几乎变得过于敏感。我的意思是，实际上在页面上滚动变得非常困难，因为有许多小“瓷砖”都连接到 .click()。听众，通过在手机/平板电脑上滚动来触发。

我真的在寻找最佳实践或任何人可能有的关于如何最好地处理这个问题的任何想法。在谷歌搜索之后，我一直没有成功找到任何对我有值(value)的东西。

我有一些想法，但还没有实现

• 添加一个延迟，这样一个人在运行 click() 中的代码之前必须实际点击并按住一两秒。事件监听器
• 使用媒体查询，大幅减少 click() 元素的大小听众必须

无论如何，这里有一个 HTML 示例和输出到浏览器时最终产品的屏幕截图

HTML -- 这些小东西有很多 <a>与响应式 CSS 堆叠的连续 block

<a href="#" class="brand MerchantTile" data-merchantid="2">
    <span class="image-holder">
        <img src="../images/Macys.png" />
    </span>
    <p>Shop and earn with</p>
    <p>Macys</p>
</a>

截图

Answer 1

从这里开始:Understanding touch events尝试将点击事件迁移到触摸事件以防止这种情况发生。