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

89387341 2013-07-25

<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

相关推荐