expand an element from right to left

Question

I would like to make a li element expand from right to left. I mean, if my element has the following css :

li{
   position:absolute
   left:10%;
   top:40px;
   width:100px;
}

how can I make that element top expand to the left with jquery, so that its top-right won't move, and it will be its left border that will move?

For now, I just have the following jquery, doing the same thing... from left to right:

$('li').animate({width:'+=100'},400);

Thanks in advance for helping!

score 7 · Accepted Answer · answered Jul 17 '11 at 19:07

7

I recommend setting your element's position using top: and right: rather than top: and left: in CSS, so when it grows the right side remains in the same place.

answered Jul 17 '11 at 19:07

jtbandes

110,948
34
232
256

Oh thanks. So stupid. I really didn't think about that, thanks a lot! – evuez Jul 17 '11 at 19:52
@evuez: No problem! If this answered your question you can mark it as the correct answer by clicking the checkmark. Thanks :) – jtbandes Jul 17 '11 at 19:55

score 1 · Answer 2 · edited May 23 '17 at 12:31

1

there is a similar query on this that you can find here: jQuery slide left and show

edited May 23 '17 at 12:31

Community

1
1

answered Jul 17 '11 at 19:40

vynx

1,259
1
12
20

expand an element from right to left

2 Answers2