jquery滑动菜单打开/关闭动画问题

Question

我在本地测试了这个：http://jsfiddle.net/fYkMk/1/ 这是一个预订表单，它在鼠标悬停（预订蒙版）时打开，并在鼠标离开时关闭。 它有4个领域：

• 日期选择器
• 的客人数
• 房数
• 住宿天数

最后三个字段滑动菜单，打开了一个点击的相对图标。

这些滑动动画的工作原理直到用户在完成动画/关闭动画之前决定在预订蒙版div上再次“mouseover”，然后“mouseleave”和“mouseover”。

所以它发生的列表被打破，我只能看到一块他们。[见下图]

希望你能帮助我了这一点。 感谢

卢卡

Answer 1

jQuery的动画设置能见度隐伏，所以它看起来像一个问题ü应该重置它的每一个。例如这里：

$('.booking-mask').mouseenter(function(){ 
       mouseOverBooking = true; 
       $(this).css('overflow', 'visible'); 
       openBookingMask(); 
       }); 

只要把

$(this).css('overflow', 'visible'); 

在正确的地方

更顺利工作。

updated fiddle

Answer 2

我实在看不出这三个按钮，在你的榜样，但尝试在你的代码implenting .stop(true, true)，如果动画碰撞，尝试建立另一个动画qeue，我相信默认jQuery的一个是“fx”。还有.qeue（）和.deqeue（）函数可以帮助你，转到jQuery网站并阅读文档，或者等一下，看看有人更聪明，然后我就知道了。

如果我正确理解这一点，下拉菜单消失在主站点/背景后面的一点，而且实际上看起来更像是一个css问题，可能与隐藏溢出有关。

.choose-list li{overflow: visible; z-index: 9999;} 

.choose-list li:hover{ 
    background:#8B753B; 
    color:white; 
    overflow: visible; 
} 

这是否解决？

编辑：用我的笔记本电脑和窗户，FF我看到你在谈论;-)

在我看来，问题.booking面罩去那边溢出隐藏，可能是jQuery的切换或东西否则你在CSS一样，但增加的重要修复它为我的小提琴，是这样的：

.booking-mask{ 
    background: red; 
    height: 58px; 
    margin: 44px 0 0; 
    position: fixed; 
    right:0; 
    top: 0; 
    z-index: 3; 
    overflow:visible!important; 
    /*padding:0;*/ 
    color:white; 
}