BlueImp Gallery 允许垂直拖动图像

Question

我正在轮播中使用 blueImp image gallery。我允许为移动用户拖动图像，但可以垂直和水平拖动图像，这意味着您可以将图像的一半拖出屏幕。

随着您的拖动，.slide 元素会内嵌更改为尺寸，例如： style="transform:translate(-100px, 256px)"

我试过设置 translateY(0) !important 但这只会完全覆盖拖动。

我正在使用jQuery，所以也许有一种观看拖动事件的方法？任何有用的帮助。

Answer 1

我设法做到的唯一方法是覆盖 blueimp 的 ontouchmove 函数。您只需要注释掉 translateY 调用即可。我从 https://github.com/blueimp/Gallery/blob/master/js/blueimp-gallery.js.

获取了来源

将整个覆盖放在您的 js 中的某个位置，最好将文件与注释分开以备将来使用。

blueimp.Gallery.prototype.ontouchmove = function (event) {
    ...
    } else {
        // Removed move up/down funictionality
        //this.translateY(index, this.touchDelta.y + this.positions[index], 0);
    }
};

希望对您有所帮助！也许 blueimp 可以添加一个选项来在将来切换此行为:)

Pav

BlueImp Gallery 允许垂直拖动图像

BluImp Gallery allows image to be dragged vertically

javascript

jquery

blueimp