jquery animate doesn't work

[canyUnima]

Hi I have a simple slider with this codes:HTML Code:\[code\]<div id="gallery"> <a href="http://stackoverflow.com/questions/15738227/#" id="left-arrow">..</a> <a href="http://stackoverflow.com/questions/15738227/#" id="right-arrow">..</a> <div id="container"> <div class="item">...</div> <div class="item">...</div> ... <div class="clr"></div> </div></div>\[/code\]CSS Styles:\[code\]#gallery { position:relative; width:290px; height:200px; overflow:hidden;}#gallery #container{ position:absolute; left:0px; top:0px; width:1160px;}#right-arrow, #left-arrow{ width:30px; height:30px; position:absolute; top:85px; z-index:200;}#right-arrow{ right:10px;}#left-arrow{ left:10px;}\[/code\]JS Codes:\[code\] <script type="text/javascript"> $(document).ready(function(){// I must set left position explicitly if not when fetching left position it returns "auto"// I used position.left property, however. but It doesn't returns left relative // to parent insted (I think) relative to document which (I don't know why? It is not // according to Jquery documentation which position.left - .offset() is relative to document) $('#container').css('left', '0px'); $('#right-arrow').click(function(){ move('right'); }); $('#left-arrow').click(function(){ move('left'); }) move = function (direction){ . . . // The problem is here: $('#container').animate(left:'+=290'); // although setting it's css left position doesnt work $('#container').css('left', '290px'); // I return container to use it in console! return $(#container'); } }); </script>\[/code\]I used console to debugging it I found that it properly sets css position to whatever I want but actually it doesn't workTake a look at:Console:\[code\]>>> var x = move()Object[div#container]>>> x.css('left', '1000px')Object[div#container]>>> x.css('left')"1000px"// But It doesn't move in reality \[/code\]I Hate Javascript, Please help me I don't know what is the problem