Magento 2 Fotorama滑块鼠标拖拽滑动时意外触发全屏模式问题

使用Fotorama滑块时遇到异常现象：

• 使用鼠标拖拽Fotorama滑块滑动
• 松开鼠标想要再次拖拽切换下一张图片时，会自动触发全屏模式

前置条件 #

• 已在Magento 2.4版本验证该问题，且该问题大概率存在于更早的Magento 2版本中

复现步骤 #

• 安装全新的Magento项目
• 创建一个包含多张图片的商品
• 前往前端商品详情页
• 拖拽商品图片滑块滑动几个像素的距离
• 松开鼠标后就会触发全屏模式

预期结果 #

• 松开鼠标时应该允许用户选择是否滑动到下一张图片
• 不会自动打开全屏模式

实际结果 #

• 仅想用鼠标拖拽滑动图片，却意外触发了全屏模式

修复方案 #

该问题是Fotorama内置的点击判定逻辑缺陷导致：短距离拖拽的位移小于默认判定阈值时，会被误识别为点击操作，进而触发全屏打开逻辑。可以通过调整Fotorama的点击判定阈值修复该问题：

1. 找到当前Magento主题的视图配置文件，默认路径为 app/design/frontend/[主题包名]/[主题名]/etc/view.xml
2. 在文件中找到<vars module="Magento_Catalog">节点，新增Fotorama配置项调整阈值：

<var name="gallery">
    <var name="fotorama">
        <var name="clickThreshold">10</var>
    </var>
</var>

clickThreshold参数代表系统判定为点击操作的最大拖拽像素位移，默认值为3，调整为8~12即可避免短距离滑动被误识别为点击。

3. 执行php bin/magento cache:clean清除Magento缓存后验证效果即可。

内容的提问来源于stack exchange，提问作者n44s