使用jQuery调整大小后调整大小后的宽度

Question

当我使用jQuery resizable调整div的宽度时，没有获得正确的宽度。 调整宽度从250px到200px在jQuery中获得宽度是250px。但背景颜色位置是200px。我再次从200px调整到150px，获得的值是200px。为什么我有起始宽度位置。请帮我结束宽度位置。

请检查下面的代码和附图并更正我？

https://jsfiddle.net/duL8gu3b/17/

CSS

#profile #graph #bar1 #bar1_slider {
   background: #1640c0;
   width: 250px;
}

JS

$( "#graph .slider" ).resizable({
        animateEasing: "easeOutBounce",
        helper: "ui-resizable-helper",
        animate: true,
        handles: 'w',
        maxWidth: 250,
        grid: [ 50, 10 ] ,
        stop: function( event, ui ) {
            /*graph = ui["size"]["width"] / 50;
            alert(graph);*/
             var graph1 = $("#bar1_slider").width() / 50;

             $.post("/graph", { graph1: graph1},
                    function (response) {
             });
        }
    });

Answer 1

问题是动画。 Jquery在完成动画之前返回宽度值，因此元素的宽度没有改变。您可以在1秒延迟后返回值。 Check this

animateDuration: 0