javascript - 实际页面上的 slideUp 不同

Question

我正在尝试slideUp()在一堆没有图像的项目上使用 JQuery 函数。我编写的代码在 JSFiddle 中运行良好，但在我的实际页面上，它以一种笨拙的方式崩溃。

为什么他们的行为方式不同？

JSFiddle

要激活页面上的功能，请点击右侧菜单中的复选框

真实页面

Answer 1

通过 CSS 筛选几分钟，我找到了解决方案，我列出了更正列表。

这是 pastebin 上的 CSS 代码，它完成了我在下面提到的所有修复。

手动修复

查找#middlewrapper #content .contentbox，禁用float:left。

#middlewrapper #content .contentbox {
    width: 650px;
    padding: 15px;
    /* float: left; */
    background-color: white;
}

查找#middlewrapper #content .contentbox_shadow，禁用float:left。

#middlewrapper #content .contentbox_shadow {
    width: 690px;
    height: 20px;
    /* float: left; */
    background-image: url('http://xn--nstvedhandel-6cb.dk/naestved/public/css/../images/content_skygge.png');
    background-repeat: no-repeat;
}

查找#middlewrapper #content，禁用float:left。

#middlewrapper #content {
    width: 690px;
    /* float: left; */
}

最后， find #middlewrapper #content .contentbox，在它的定义之后， place #content。

#content {
    width: 680px;
    float: left;
}

不要删除或更改#middlewrapper #content后几行找到的定义。