我正在使用 jQuery 的 .animate()
增加 div
的 width
。
div
包含一个绝对定位的子元素,其边界跨越父元素的边界。
当动画开始时,子元素 div
位于父元素之外的部分变得不可见,当动画结束时,它再次可见。
<div id=parent>
<div id=child>
</div>
</div>
#parent{
width: 200px;
height: 200px;
background: blue;
position: relative;
overflow: visible;
}
#child{
width:100px;
height: 10px;
background: red;
position: absolute;
right: -50px;
top: 100px;
}
$("#parent").animate({width: '300'}, 2000);
<强> LIVE DEMO
最佳答案
jQuery animate 在动画时自动强制元素overflow:hidden;
。
您可以使用 !important CSS 样式解决此问题:
#parent{
width: 200px;
height: 200px;
background: blue;
position: relative;
overflow: visible !important;
}
编辑 由于 CSS 优先级,内联样式可能会覆盖
!important
样式。如果是这样,请尝试这样的操作
$("#parent").animate({width: '300'}, 2000).css('overflow', 'visible', 'important');
关于javascript - jQuery 的宽度动画隐藏了溢出,尽管它是可见的,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23127477/