javascript - jQuery animate() to hide and show elements by sliding left and right -

I'm trying to animate something using jQuery.

UPDATE

The way I want it is working, it is jQuery:

  $ (document) .ready ( Function () {// go talk button $ ('go-chat input'). (Function () {$ ('#search, # go-chat'). Animate ({width: '0px'}, 1000 , Function () {$ (this) .hide (); $ ('# login, # go-search'). ({Width: '573px'}, 1000, function () {$ (this) .show () ($ ('# Login, # go-search'). Animate ({width: '0px'};}}}};}}; $ ('# go-search input'). , 1000, function () {$ (this) .hide (); $ ('#search, # go-chat') .animate ({width: '573px'}, 1000, function () {$ (this). Show ();}}}}}}};});  

The problem is that the slide is wrapping as much Stem slides and this is very ugly.

thanks

old question

Old Question

Actually, I want to slide to the left in the search bar, essentially hides it, and then slide down the 4 inputs given below. For now, I put them in the search bar but my plan is to hide them, and when the "go chat" button is pressed, the search is slammed to the left And 4 inputs slide to the right.

Right now, the search box slides into the center and does not completely disappear. How can I do it, so should it work? If my explanation is unclear which I am seeing, please ask for clarification.

Thank you.

Try changing

  $ ('# search') . Animate ({width: '0px',}, '1000'); ({Width: '0px'}, 1000, function () {$ (this) for  

  $ ('# search'). .to conceal();              });  

Once the animation is complete, the element will be hidden.

I have also noticed that the 'search' text is not well animated. Before animate, try to delete the text (or disappear) Remember to return to show it again Example:

$ ('# search-label') . Hide ();

or

$ ('# search-label'). FadeOut ();