animating div elements left to right and back

Question

I have a menu system made up of divs and i want to animate the left property to slide each time the user mouses over a menu item but i need the outer div(which is black) ele

Answer 1

You should be able to fix the left is null issue by having the code not execute on the last .content, like this:

$('.container').not(':last').find('.menu-item').mouseenter(function () {

This will not apply to the menu-items within the green box.

For the re-show issue, I would change the way you are showing. Instead of sliding the box out from behind the other, you can position it where you want it to end up and hide it, then you can use:

.animate({width: 'show'})

Which will give a similar sliding effect.

That, or do it similar to my response to your other question, only without the collapsing I had previously:

http://jsfiddle.net/V3RHr/3/