jQuery 元素内部全是浮动元素时使用slideToggle函数的注意事项

<div class="container" style="width: 100px; height: 50px;">

    <div style="float: left; height: 10px; width: 10px;"></div>

    <div style="float: right; height: 10px; width: 10px;"></div>

</div>

 

我们要对.container元素，使用slideToggle函数，实现滑动打开和关闭。如果直接使用，会发现在滑动打开之后和滑动关闭之前，内部的元素会变窄，然后跑到中间。为了防止出现这种情况，我们要使用css，清除container内部元素的浮动。

清除的方法有很多，例如:

1. {overflow:hidden; clear: both;}

2. container:after {content: ""; height: 0; display: block; clear: both;}

等等

 

需要注意的是，overflow:hidden，需要指定高或宽某一个的数值时，才有可能对溢出的内容进行剪裁。overflow:hidden的资料：http://www.ofcss.com/2011/03/20/misunderstood-of-overflow-hidden.html