0

我在本地测试这个：http: //jsfiddle.net/fYkMk/1/ 这是一个预订表格，在鼠标悬停时打开（预订掩码）并在鼠标离开时关闭。它有 4 个字段：

  • 日期选择器
  • 客人人数
  • 房间号
  • 夜数

最后三个字段是滑动菜单，单击相关图标即可打开。

这些滑动动画一直有效，直到用户决定“鼠标悬停”然后“鼠标离开”和“鼠标悬停”在预订掩码 div 上再次完成，然后才完成操作/关闭动画。

所以碰巧列表被破坏了，我只能看到其中的一部分。[见下图]

在此处输入图像描述

希望你能帮我解决这个问题。谢谢

卢卡

4

2 回答 2

0

在您的示例中我真的看不到这三个按钮，但是尝试.stop(true, true)在您的代码中实现，如果动画发生冲突，请尝试设置另一个动画队列，我相信默认的 jQuery 是“fx”。还有 .qeue() 和 .dequeue() 函数可能对您有所帮助，前往 jQuery 站点并阅读文档，或者等待看看是否有人比我更聪明。

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

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

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

这能解决吗？

编辑：使用我的笔记本电脑和带有 FF 的 windows 我明白你在说什么;-)

在我看来，问题是 .booking-mask 过度隐藏，可能是 jQuery Toggle 或您在 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;
}
于 2011-10-09T14:11:38.587 回答
0

jQuery animate 将可见性设置为隐藏，所以你应该在每一个看起来有问题的地方重新设置它。例如这里：

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

就放

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

在正确的地方工作更顺利。

更新的小提琴

于 2011-10-09T18:29:19.830 回答