jQuery鼠标向下调整大小

Question

嗨，我在图像中有一个要求热点选择热点问题类型admin，我们需要捕获该热点位置。在用户端基于点击，我们需要找出用户点击是否有效。 我正在获得职位，但我面临的问题是鼠标按下时热点重新调整大小，任何人都可以帮助我完成任务..鼠标按下并同时调整大小的问题

找到链接

http://jsfiddle.net/sarath704/Ju5cA/1/

只需检查小提琴链接即可浏览该图像中的一个图像，然后单击任意位置并拖动一次。 意味着选择一些部分。 当我尝试单击并拖动鼠标时，它无法调整大小；当我单击一次并尝试重新调整大小后，它可以正常工作。 我想一次点击+调整大小

var $hotspot = $('<div id="hotspot_' + spotCount + '"></div>').css({
    'position': 'absolute',
    'display': 'block',
    'left': (e.pageX - $(this).offset().left) - (e.data.x / 2),
    'top': (e.pageY - $(this).offset().top) - (e.data.y / 2),
    'height': e.data.y,
    'width': e.data.x,
    'background': 'url(' + config.icon + ')',
    'cursor': 'pointer'
}).resizable({
    handles: "n, e, s, w, se, sw, nw, ne"
}, {
    helper: "ui-resizable-helper"
});
simulateHandleClick($hotspot, 's', e.pageX, e.pageY);
$hotspot.draggable();

$imageContainer.append($hotspot);


$hotspots = $hotspots.add($hotspot);

$hotspot.on('click', initSpotConfig);
}



var simulateHandleClick = function (item, handle, x, y) {

    item.find('.ui-resizable-' + handle).trigger({
        type: 'mousedown',
        which: 1,
        pageX: x,
        pageY: y
    })