jQuery UI 滑动效果问题

Question

我正在重新设计我公司的网站，我们将使用 jQuery、Flash 等大量使用效果。到目前为止，我在执行这些操作时没有遇到太大问题，但是两个小问题不断出现，在询问了这里的人之后，我除了成功之外一无所获，所以这里是:

有问题的开发页面:(已删除 URL)

第一期

单击“结果”下顶部导航栏中的绿色箭头。这应该从右向左滑出菜单。它在 Firefox 中的行为与它应该的一样，但 IE 和 Safari 在页面中间开始向左滑动动画，然后将菜单移回它所属的位置。我不知道为什么要这样做，因为菜单本身绝对位于 CSS 中。另一个问题是，一旦菜单打开并且您尝试关闭它(使用类似颜色的箭头)，它会像在 Firefox 中一样转换，但一旦转换完成就会重新出现。在 IE 和 Safari 中，菜单永久消失，但动画再次从页面中间开始。

第二(排序)问题

如果可以解决这个滑动问题，我想对底部的“桶”应用类似的效果，当您单击它们下方的灰色箭头框时，它们会上下滑动。目前，我正在破解 jQuery 中的 .animate 函数，首先增加高度，然后应用负边距，如下所示:

$('#footer-bucket1')
    .animate({ height: '392px' }, 300)
    .animate({ marginTop: '-306px'}, 300)
    .addClass('bucket-open');

当我对其应用向上滑动过渡时，我可以看到该框变大了，但在向下的方向上，离开了页面(应用了 overflow: hidden)。有没有一种方法可以指定框按字面意义向上滑动以显示内容，就像现在一样？提前致谢!

Answer 1

首先，我会给所有 img 元素一个固定的 width 和 height 并 display 它们 内联，然后进一步观察。

更好的方法是将它们用作 css background-image。