Taggable jQuery plugin

fiddle.html

<div id="tagme" style="height:500px;width:500px;background-color:#DDF"></div>

fiddle.js

$("#tagme").taggable();

fiddle.manifest

name: Taggable - taggable jquery plugin
description: Click and drag tagging
authors:
  - Sam Greenhalgh
resources:
  - /gh/gist/taggable.js/5029508/

taggable.js

(function ($) {

    $.fn.taggable = function () {

        var saveArtifact = function (x, y, h, w) {

        }

        var createArtifact = function (x, y, h, w) {
            // Fade out any displayed controls
            $('.controls').fadeOut();

            var tag = $('<div>');

            // Add handles
            var hLst = ['ne', 'nw', 'sw', 'se'];
            var handles = {};
            for (var i = 0; i < hLst.length; i++) {
                var handle = $("<div>");
                handle.addClass("ui-resizable-handle");
                handle.addClass("ui-resizable-" + hLst[i]);
                tag.append(handle);
                handles[hLst[i]] = handle;
            }

            //Add controls
            var controls = $('<div>');
            controls.addClass('controls');

            var saveControl = $('<div>');
            saveControl.addClass('save');
            saveControl.bind("click", function () { saveArtifact(); })

            var cancelControl = $('<div>');
            cancelControl.addClass('cancel');

            var deleteControl = $('<div>');
            deleteControl.addClass('delete');

            controls.append(saveControl);
            controls.append(cancelControl);
            controls.append(deleteControl);

            tag.append(controls);

            // Setup element
            tag.addClass('tag');
            image.parent().append(tag);
            tag.draggable();
            tag.resizable({ autoHide: true, 'handles': handles });
            tag.css({ position: 'absolute', top: x + 'px', left: y + 'px', height: h + 'px', width: w + 'px' });

            //Show controls
            tag.bind("click", function () {
                $('.controls').fadeOut();
                controls.fadeIn();
            });
        }

        var image = this;

        var offset = $(image).offset();

        image.parent().css({ position: 'relative' });

        image.bind('mousedown', function () {

            createArtifact(5, 5, 20, 15);

        });

        this.createArtifact = createArtifact;

        return this;
    }
})(jQuery);

Live Demo
http://jsfiddle.net/PndbW/