CODEWITHSUNDEEP
jquerygoogle-chromejquery-animate
user398341
user398341

Reputation: 6577

jQuery animate() left position in Google Chrome and Safari

I'm trying to create a simple animation where element after being appended to the container is sliding in from the left side like so:

$('#container').append(
$('<div class="item" style="left:-300px;top:0"></div>').animate({ left : 0 }, 300)
);

Container has the overflow hidden and width 300px. The appended 'item' element has also 300px width and is outside of the container when appended, then should slide in until it reaches 'left : 0'.

It works in Firefox, but Google Chrome and Safari simply displays it in the container without sliding it in.

Any idea?

Upvotes: 0

Views: 1701

Answers (1)

Samich
Samich

Reputation: 30115

Probably you need to add element befor animating: 

$('<div class="item" style="left:-300px;top:0"></div>').appendTo('#container').animate({ left : 0 }, 300)

Upvotes: 3

Related Questions