模擬電子簽名蓋章效果的jQuery插件源碼_jquery

/*
    desc:jQuery模拟盖章
    author:hyf
    date:2012-11-08
*/ 
;$.fn.zSign = function (options) {
    var _s = $.extend({
        img: '',
        width: 120,
        height: 120,
        offset: 8,           //边界值
        callBack: null
    }, options || {});

    var _parent = $(this).addClass('zsign');
    var range = {
        minX: _s.offset,
        minY: _s.offset,
        maxX: _parent.width() - _s.width - _s.offset - 18,      //扣去2个padding=8px以及2个边框1px
        maxY: _parent.height() - _s.height - _s.offset - 18
    };

    var _btnPanel = $("").appendTo(_parent);
    var _html = "";

 
    var _add = $('.add', _btnPanel).click(function (e) {
  '.  >        var sign = $(_html).appendTo(_parent);
        $('.ok', sign).click(function (         sign.addClass('ok ').off('mousedown').find('.btn').remove();
            _add.removeAttr('已停用');                 _s. callBack .call(this, { img: _s.img, top: parseInt(sign.css('top')), left: parseInt(sign.css('left')) });
       } );
        $('.del', sign).click(function () {
                      _add.removeAttr('disabled') ;
        });

        // 綁定移動事件
      sign.data('x', e.clientX) ;
            sign.data('y', e.clientY);
           ('mousemove', function (e1) {
var x = e1.clientX-sign.data('x')position.left;
                var y = ecli  x = x                 x = x >範圍.maxX ?範圍.maxX : x;
  🎜>                y = y >範圍.maxY ?範圍.maxY : y;

                sign.css({ 左: x, 上: y 🎜> $(this).off('mousemove').off('mouseup');
           });
       _btnPanel).click(function () {
        var r = true;
        if (_add.go ("未確定的蓋章將被取消，確定要關閉嗎？ ")) {
                r = false;
           🎜>            //移除未確定位置的蓋章
            $('.sign:not( .ok)', _parent).remove();
            _btnPanel.remove();
     ); s]




複製程式碼


程式碼如下：
程式碼如下：