Question

有一个jQuery插件可以让你构建水平手风琴，它在除Firefox之外的所有浏览器中都很棒。我的主要问题是我对调试客户端代码有些不熟悉，我主要是Java程序员，虽然我对客户端技术有很好的了解，但实际上试图调试这个问题让我迷失了，有人可以看看错误，如果可能的话确定根本原因，并分享他们如何解决问题？

I've already set up a reproduction of the code, the gray bars are "handles" click them to expand their content, light gray means already expanded, dark gray means minimized

当我提到手风琴时，我的意思是完整的组件，在这种情况下，两个句柄，以及显示的内容

以下是我已经知道的一些让你入门的事情：

在动画期间，手风琴的大小增加1或2个像素
当包含div的大小设置为手风琴大小
如果包含div的大小增加，则大小仍会增加，从而产生最右边的“颤抖效果”
问题仅存在于firefox上

Answer 1

尝试稍微调整一下CSS（updated demo）：

#containingDiv {
    height : 200px;
    width : 460px;
    overflow: hidden;
}

#myAccordion {
    width: 2000px; /* should be wide enough to contain all panels - max width in opera is 32766 */
}

更新：在提到standard CSS for the hrzAccordion后，我发现向句柄添加负右边距可修复所有闪烁问题（updated demo）：

.handle {
    height : 200px;
    width : 30px;
    background : #aaaaaa;
    margin : 0 -1px 0 0;
    padding : 0px;
}

横向手风琴 - jQuery插件 - Firefox上的滚动动画错误 - 如何调试

1 个答案: