$( ".box-handle" ).draggable({
    containment: ".container",
    scroll: false,
    drag: function () { /* While dragging check for stuff */

        var box = $(this);
        var boxPosition = box.position();
        box.find('.arrow').show();

        if (boxPosition.left >= 90)
        {
            // In the parent div called ".box" find ".box-line"
            box.closest('.box').find('.box-line').css({
                'top':'50px', /* Put top left corner of ".box-line" a the edge of ".static" */
                'left':'110px',
                'width': boxPosition.left - 60, /* Put bottom right corner of ".box-line" a the edge of current dragged box */
                'height': boxPosition.top + 50,
                'border':'none',
                'border-top':'1px solid #bfbfbf',
                'border-right':'1px solid #bfbfbf'
            });
            /* place the arrow*/
            box.find('.arrow').css({
                'top':'-10px',
                'left':'45px'
            });
        }
        else if (boxPosition.left < 90)
        {
            box.closest('.box').find('.box-line').css({
                'top':'110px',
                'left':'50px',
                'width': boxPosition.left,
                'height': boxPosition.top - 60,
                'border':'none',
                'border-left':'1px solid #bfbfbf',
                'border-bottom':'1px solid #bfbfbf'
            });
            box.find('.arrow').css({
                'top':'45px',
                'left':'-10px'
            });
        }
    }
});