jquery - border right 样式不向下延伸 Accordion

Question

我创建了一个 html 页面，在一个 div 元素中有一个 Accordion ，在另一个 div 元素中有一个菜单。菜单 div 在元素右侧有一个简单的边框样式，使用

height:100%;
 border-right-width:2px;
 border-right-style:solid;
 border-right-color:#4875B4;

这一切都很好，但是，每当我展开 Accordion 标题时，边框也不会展开(我认为它会因为高度设置为 100%)。我无法在 Accordion 上使用边框样式，因为在我使用的代码中我将其默认隐藏。

http://jsfiddle.net/ZxnAd/ JSFiddle 请选择“第 3 节”，查看边框未展开 Accordion

Answer 1

有两种方法可以解决你的问题

首先

从#menus中移除右边框并将左边框应用于div.accordion

喜欢

.accordion {border-left:2px solid #F00;}

fiddle http://jsfiddle.net/ZxnAd/14/

第二

通过使用 js，您必须找到 accordion 的 height 并将该 height 应用到 div#menus 在 accordion div 的 click 事件 上，例如，

$('div#menus').height($('div.accordion').height());

但是这会产生问题，您可能需要更改HTML 结构

所以，我认为第一个对你来说很好。