jquery - 需要在jquery动画中隐藏溢出

Question

我有一个动画，我想在“容器”固定高度和宽度内播放（这里希望隐藏溢出 - 黑色边框之外的所有内容）。

 $(document).ready(function(){
    $("#animate").animate({width:"120%", top:"45%"}, 400)
    });

.container{
  width: 900px;
  height: 980px;
  border:1px solid black;
  overflow: hidden;
}

#animate{
  background: navy;
  position: absolute;
  bottom:0;
  right:0;
  height:100px;
  transform: rotate(25deg);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="container">
    <div id="animate"></div>
    <div id="animate_b"></div>
    <div id="animate_c"></div>
    <div id="animate_d"></div>
  </div>

标签： jqueryhtmlcss

Answer 1

您只需要添加position: relative;到容器元素的样式。