当前位置: 代码迷 >> Web前端 >> jQuery 元素内部全是浮动元素时运用slideToggle函数的注意事项
  详细解决方案

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

热度:70   发布时间:2013-08-01 15:23:18.0
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

  相关解决方案