jquery - 奇怪的 jQuery 行为——slide()

标签 jquery css

如果您转到此页面并点击左侧下拉菜单之一 - http://ryancoughlin.com/hp/index.php?c=about - 一旦它到达底部或回到顶部,它几乎看起来像是出现故障/碰撞。

这个问题可以解决吗?或者这就是 jQuery 中的行为方式?

代码:

$(".menu-header").click(function() {
    $(this).next().toggle('slow');
    return false;
}).next().hide();

最佳答案

在 CSS 中进行更改

#left ul li{
    font-size:.7em;
    margin:5px 0;
}

#left ul li{
    font-size:.7em;
    padding:2px 0 3px 0;
}

问题是您的边距在动画开始和结束时与 h2 的边距一起折叠,但在动画期间不会折叠,因为 overflow ul可见*,防止折叠。缺乏折叠会增加 ul 的有效大小。

* W3 on the box model and margin collapsing :

Vertical margins of elements with 'overflow' other than 'visible' do not collapse with their in-flow children.

关于jquery - 奇怪的 jQuery 行为——slide(),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/664260/

相关文章:

jquery - 如何将 After Effects 动画嵌入我的网站?

javascript - 根据先前选择标签中的选择设置选择标签的可见性

css - css3 matrix3d 第四列背后的精确数学是什么?

css - Bootstrap 无法与 meteor 一起正常工作

javascript - Bootstrap Popover 在 jQuery Post 后不起作用

asp.net-mvc - 发布时 Jquery 数据表的样式问题(可能是捆绑问题)

javascript根据条件显示或隐藏类

javascript - 在隐藏的 div 中加载 Twitter 关注按钮

javascript - 当我的复选框未被选中时,我需要改变我的成功

jQuery .slideUp() 跳过动画