当我们调整画布大小时,停止擦除功能

时间:2015-07-02 12:57:58

标签: jquery canvas

我在画布图像上添加了Resizable效果,所以当我点击“删除”按钮并正确删除时但是当我点击“调整大小”按钮时,它仍然在拖动和调整大小时擦除。我需要在点击调整大小按钮时停止橡皮擦功能。

我已从此链接https://github.com/boblemarin/jQuery.eraser

添加了jquery

的JavaScript

$(function(){$('#eraserrr').click(function(event){
  $('#redux').eraser();
  $('.image').resizable('destroy');
  $('#draggableHelper').draggable('disable'); 
  event.stopPropagation();
});

$('#resizee').click(function(event) {
  $('#redux').eraser('disable');
  $('.image').resizable();
  $('#draggableHelper').draggable();
  event.stopPropagation();
});
$('#resetBtn').click(function(event) {
  $('#redux').eraser('reset');
  $('#progress').html('0%');
  event.preventDefault();
});
$('#clearBtn').click(function(event) {
  $('#redux').eraser('clear');
  $('#progress').html('100%');
  event.preventDefault();
});

HTML

<span class="container">
  <img id="robot" src="img/robot.jpg" />
  <div id="draggableHelper">
    <img id="redux" class="image"  src="http://minimal.be/lab/jQuery.eraser/img/robot_redux.png" />
  </div>
  <div id="progress">0%</div>
</span>
<p>
  <div id="resetBtn" class="box"> RESET </div>
  <div id="clearBtn" class="box"> CLEAR </div>
  <div id="eraserrr"> ERASER </div>
  <div id="resizee"> Resize </div>
</p>

1 个答案:

答案 0 :(得分:0)

替换这样的功能?

$(function(){
  $('#eraserrr').click(function(event){
    $('.image').resizable('destroy');
    $('#draggableHelper').draggable('disable'); 
    event.stopPropagation();
  });
});