How can I animate the opposite way?

Question

Hi,

I am changing the width of the element that serves as the bar and this works. However, I cannot make it animate him in the opposite direction. I tried putting - before bar_width, but to no avail. The width will be dynamically calculated exactly so that I want the direction to go left and not right, as shown below. <------- not ----------->

var bar_width=$(this).css('width') ;
$(this).css('width', '0').animate({ width: bar_width }, queue:false,duration:3500,easing: easing});

Answer 1

You can animate it from right to left, while animating margin-leftand widthelements:

CSS

#bar {
    margin-left: 100px;
    height: 10px;
    width: 0;
    background: red;
}

JQuery

$('#bar').animate({
    marginLeft: 0,
    width: 100
});

In action here .

, , left width .

Answer 2

0 "toggle" , :

$(this).animate({ width: "toggle" }, queue:false, duration:3500, easing:easing});

"toggle" 0, - .