jQuery Smart Guides Examples

    var opts = {
        containment: "parent",
        smartGuides: true,  
        appendGuideTo: '.drag:not(".selected")',  
        snapTolerance: 10,
        beforeStart: function () {
            var $this = $(this);
            if (!$this.hasClass('selected')) {
                $this.siblings('.selected').removeClass('selected');
                $this.addClass('selected');
            }
        }
    };
    $('.container .drag')
        .draggable(opts)
        .resizable($.extend({ handles: 'all' }, opts ));

    .container {
        position: relative;
    }
    .drag {
        position: absolute;
    }

    var opts = {
        containment: "parent",
        smartGuides: true,
        appendGuideTo: '.drag:not(".selected")'
        snapTolerance: 10,
        beforeStart: function () {
            var $this = $(this);
            if (!$this.hasClass('selected')) {
                $this.siblings('.selected').removeClass('selected');
                $this.addClass('selected');
            }
        }
    };
    $('.container .drag')
        .draggable($.extend({
            multiple: true,
            selected: '.selected'
        }, opts))
        .resizable($.extend({ handles: 'all' }, opts ));

    .container {
        position: relative;
    }
    .drag {
        position: absolute;
    }
    .smart-guide {
        border-color: black;
        border-style: dashed;
    }

    var opts = {
        containment: "parent",
        smartGuides: true,
        appendGuideTo: '.drag:not(".selected")'
        guideClass: 'guide',
        snap: '.snap-container',
        snapTolerance: 10,
        beforeStart: function () {
            var $this = $(this);
            if (!$this.hasClass('selected')) {
                $this.siblings('.selected').removeClass('selected');
                $this.addClass('selected');
            }
        }
    };
    $('.container .drag')
        .draggable(opts)
        .resizable($.extend({ handles: 'all' }, opts ));

                
    .container {
        position: relative;
    }
    .drag {
        position: absolute;
    }
    .guide {
        border-color: blue;
        border-style: dotted;
    }