javascript - 在 elevatezoom.js data-zoom-image 的图像上滚动在移动设备上不起作用

标签 javascript html css

我在产品详细信息页面中对缩放图像使用了以下代码,但是当您想要滚动缩放插入的图像并且您用手指站在图像上时无法在手机中向上或向下滚动

<div class="relative d_inline_b m_bottom_10 qv_preview d_xs_block" style="height: 440px">
     <img title="Silver Diamond Band Ring" itemprop="image" style="cursor:zoom-in;position: relative;top: 50%;transform: translateY(-50%);" id="zoom_image" src="/img/product/thumb/1510161025300784.jpg" data-zoom-image="/img/product/big/1510161025299740.jpg" class="tr_all_hover" alt="Silver Diamond Band Ring">
     <a href="/images/preview_zoom_1.jpg" class="d_block button_type_5 r_corners tr_all_hover box_s_none color_light p_hr_0"><i class="fa fa-expand"></i></a>
</div>

最佳答案

通过这样做解决了问题:

jquery.elevatezoom.js 中搜索 touchmove 事件并从移动 View 中删除 preventDeafult()

关于javascript - 在 elevatezoom.js data-zoom-image 的图像上滚动在移动设备上不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40128811/

相关文章:

javascript - 应用组合转换时属性无效

javascript传递 bool 比较混淆的结果

html - 各种div的对齐

javascript - 做一个像灯弓一样的东西,里面没有图像

jquery - 在移动应用程序中单击/选择号码时如何在号码上显示设备拨号盘

javascript - 实用的FlapJax

javascript - 无法使用 Javascript 通过 ExpressionFilter 访问 DynamoDB 项目的映射属性值

html - 为什么两个div不是并排的

html - 不透明度不起作用,即使我没有发现语法错误

javascript - 如何在 react 中制作阅读更多按钮?