(function ($) {
$.fn.stickynote = function (options) {
var opts = $.extend({}, $.fn.stickynote.defaults, options);
return this.each(function () {
$this = $(this);
var o = $.meta ? $.extend({}, opts, $this.data()) : opts;
switch (o.event) {
/*case 'dblclick':
$this.dblclick(function(e){$.fn.stickynote.createNote(o);})
break;*/
case 'click':
$this.click(function (e) {
$.fn.stickynote.createNote(o);
})
break;
}
});
};
$.fn.stickynote.defaults = {
size: 'large',
event: 'click',
color: '#FF0000',
};
$.fn.stickynote.createNote = function (o) {
//o.preventDefault();
var _note_content = $(document.createElement('textarea'));
var _div_note = $(document.createElement('div'))
.addClass('jStickyNote')
.css('cursor', 'move');
if (!o.text) {
_div_note.append(_note_content);
var _div_create = $(document.createElement('div'))
.addClass('jSticky-create');
/*.attr('title','Create Sticky Note');*/
_div_create.mouseup(function (e) {
var _p_note_text = $(document.createElement('p'))
.css('color', o.color)
.html(
$(this)
.parent()
.find('textarea')
.val());
$(this)
.parent()
.find('textarea')
.before(_p_note_text)
.remove();
$(this).remove();
})
} else _div_note.append('<p style="color:' + o.color + '">' + o.text + '</p>');
var _div_delete = $(document.createElement('div'))
.addClass('jSticky-delete');
_div_delete.mouseup(function (e) {
$(this).parent().remove();
})
var _div_wrap = $(document.createElement('div'))
.css({
'position': 'absolute',
'top': '0',
'right': '0'
})
.append(_div_note)
.append(_div_delete)
.append(_div_create);
switch (o.size) {
case 'large':
_div_wrap.addClass('jSticky-large');
break;
case 'small':
_div_wrap.addClass('jSticky-medium');
break;
}
if (o.containment) {
_div_wrap.draggable({
containment: '#' + o.containment,
scroll: false,
start: function (event, ui) {
if (o.ontop) $(this).parent().append($(this));
}
});
} else {
_div_wrap.draggable({
scroll: false,
start: function (event, ui) {
if (o.ontop) $(this).parent().append($(this));
}
});
}
$('#content').append(_div_wrap);
};
})(jQuery);
我正在开发一个便签插件，但我无法将此便签设置为可调整大小的。
在这段代码中可以做些什么来使其可调整大小？
当我不应用 CSS 时，这个粘性会被调整大小，但是当我这样做时，它不会被调整大小。
另外，如何在不使用id任何地方的属性的情况下调用这个函数，我不希望它在任何地方被硬编码。
例如，在此示例中，我使用id testsmall调用它，但我不想这样做，而且我想将它作为onclick来自 HTML 按钮的事件调用。