停止裁剪圖像外的裁剪器js

Question

一旦用戶在裁剪時將光標拖出圖像，就需要停止裁剪。

我的問題是，一旦用戶移出圖像並返回，裁剪的角落就會遠離光標。 哪個不應該發生。

下面是我創建的簡單演示。

 <link rel="stylesheet" href="https://fengyuanchen.github.io/cropper/css/cropper.css"> <link rel="stylesheet" href="https://fengyuanchen.github.io/cropper/css/main.css"> <div class="img-container"> <img src="https://fengyuanchen.github.io/cropper/images/picture.jpg" alt="" class=""> </div> <script type="text/javascript" src="https://fengyuanchen.github.io/cropperjs/js/cropper.js"></script> <script type="text/javascript" src="https://fengyuanchen.github.io/cropperjs/js/main.js"></script> 

Answer 1

您可以通過將viewMode設置為1（默認值= 0）來實現此目的

使用jQuery cropper插件的示例：

var $image = $("#PreviewImage");

$image.cropper({
    viewMode: 1,
    crop: function(event) {
       // do something
    }
});