context.fireCallback(context.settings.callbacks.dragging);
}
});
$(‘.foreground-img’, this.wrapper).draggable({
containment: $(‘.drag-containment’, this.wrapper),
cursor: ‘move’,
drag: function(event, ui) {
var self = $(this).data(‘draggable’);
//同时移动背景
$(‘.crop-background’, this.wrapper).css({
left: (parseInt(self.position.left) + context.settings.cropFrameRect.left + 1) + ‘px’,
top: (parseInt(self.position.top) + context.settings.cropFrameRect.top + 1) + ‘px’
});
//得到截图左上点坐标
context.settings.left = context.settings.cropFrameRect.left – parseInt($(‘.crop-background’, this.wrapper).css(‘left’));
context.settings.top = context.settings.cropFrameRect.top – parseInt($(‘.crop-background’, this.wrapper).css(‘top’));
//移动图片的callback
context.fireCallback(context.settings.callbacks.dragging);
}
});
//点击缩放
$(‘.zoom-out-button,.zoom-in-button’, this.wrapper).click(function() {
var step = $(this).hasClass(‘zoom-in-button’) ? context.settings.zoom.step : -context.settings.zoom.step;
var tempZoomLevel = context.formatNumber(context.settings.zoomLevel + step, 3);
//如果缩放级别超出范围 或者 缩放导致图片右下角没在截取框内 则取消缩放
if (context.settings.zoomLevel >= context.settings.zoom.min
&& context.settings.zoomLevel <= context.settings.zoom.max
&& parseInt($(‘.crop-background’, this.wrapper).css(‘left’)) + tempZoomLevel * context.img.width > context.settings.cropFrameRect.left + context.settings.width
&& parseInt($(‘.crop-background’, this.wrapper).css(‘top’)) + tempZoomLevel * context.img.height > context.settings.cropFrameRect.top + context.settings.height
) {
context.settings.zoomLevel = tempZoomLevel;
context.zoom(context.img.width * context.settings.zoomLevel, context.img.height * context.settings.zoomLevel);
$(‘.zoom-scroller’, this.wrapper).css(‘left’, context.settings.zoomLevel * 200 / (context.settings.zoom.max – context.settings.zoom.min) + ‘px’);
}
context.fireCallback(context.settings.callbacks.zoomed);
});
//滚动条缩放
var cancelZoomScroll = false;
$(‘.zoom-scroller’, this.wrapper).draggable({
containment: $(‘.zoom-scrollbar’, this.wrapper),
axis: ‘x’,
drag: function(event, ui) {
var tempZoomLevel = (context.settings.zoom.max – context.settings.zoom.min) * parseInt($(this).css(‘left’)) / 200;
//如果缩放级别超出范围 或者 缩放导致图片右下角没在截取框内 则取消缩放
if (parseInt($(‘.crop-background’, this.wrapper).css(‘left’)) + tempZoomLevel * context.img.width > context.settings.cropFrameRect.left + context.settings.width
