从左到右和向后动画div元素 [英] animating div elements left to right and back
问题描述
我有一个由div组成的菜单系统，每当用户将鼠标悬停在菜单项上时，我都希望对left属性进行动画处理，但是我需要外部div(黑色)元素随着菜单项的移动而展开从左到右我也希望div元素(.container)向后滑动并收缩外部div元素(该黑色div的宽度为0)，我在
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) element to expand as the menu items move left to right also I want the div element(.container) to slide back and contract the outer div element(this black div which is 0 width) I have a basic example done in jsFiddle it olny moves the elements to the left
推荐答案
通过使代码不在最后一个.content上执行，您应该能够解决left is null问题，例如:
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:
这篇关于从左到右和向后动画div元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
