Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/71.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Jquery 当给孩子一个绝对位置时，引导范围会崩溃_Jquery_Css_Twitter Bootstrap_Css Position - Fatal编程技术网
Fatal编程技术网
  • jquery/
  • Jquery 当给孩子一个绝对位置时，引导范围会崩溃

Jquery 当给孩子一个绝对位置时，引导范围会崩溃

jquery css twitter-bootstrap

Jquery 当给孩子一个绝对位置时，引导范围会崩溃,jquery,css,twitter-bootstrap,css-position,Jquery,Css,Twitter Bootstrap,Css Position,我使用了一个引导行，并为它提供了它应该具有的更多跨度子项，因为我发现这有助于获得一个良好的网格工作，同时保持响应性 每个元素都有一个子元素和一个使用jQuery显示的元素，如下所示： <div class="row"> <div class="span2"> <div class="inner-element"> Content here <div class="hidden-element">

我使用了一个引导行，并为它提供了它应该具有的更多跨度子项，因为我发现这有助于获得一个良好的网格工作，同时保持响应性

每个元素都有一个子元素和一个使用jQuery显示的元素，如下所示：

<div class="row">

<div class="span2">
    <div class="inner-element">
         Content here
         <div class="hidden-element">
               More content here
         </div>
    </div>
</div>
...

</div>


满足于此
这里有更多内容
...
当单击
.span2
中的某个按钮时，
.hidden元素
div将随着
slideDown（）的增加而增加位置：绝对
CSS，这样它就越过了下面的跨距，并且不会改变网格

当在不在页面最右角的.span2元素中（在
.row
的角上）完成此设置时，效果非常好

在这个例子中可以看到这个问题。您可以看到，单击“示例#1”效果良好，不会折叠父元素，而单击“示例#2”会使
.span2
元素折叠，使下一个
.span2
元素跳上一行


原因是什么？我如何解决
 问题显然存在于
.span2
元素的
高度
属性的折叠中。在动画之前通过JavaScript综合设置高度可以实现此目的，如中所示。因此，制作动画的正确方法是：


var box = item.closest('.span2');


开放式：


box.css("height", box.height()+"px");


结束时：


box.css("height", "auto");


这将强制父图元具有固定的高度，而不会塌陷