Javascript 当jquery animate:left函数离开内部div模式时，如何在div内部隐藏div？

我有html：

<div style='width:300px; height:40px; float:left;' class='outerDiv'>
    <div style='width:200px; height:40px; float:right;' class='innerDiv'>
        Some text


    </div>
</div>

基本思想-当div.innerDiv移动到div.outerDiv的边界时，div.outerDiv应该隐藏div.innerDiv的一部分。我坚持使用div上的css样式。

参见这里：

您需要设置一个位置（相对、绝对、固定），以便css

left:200px

可以工作

css:

.outerDiv {
  overflow:hidden;
 }
.innerDiv {
  position:relative;
 }

jq:

让我知道这是否是您要找的。

请参阅此处：

您需要设置一个位置（相对、绝对、固定），以便css

left:200px

可以工作

css:

.outerDiv {
  overflow:hidden;
 }
.innerDiv {
  position:relative;
 }

jq:

---

请告诉我这是否是您要查找的内容。

如果我理解正确，您希望隐藏外部div，但显示内部div

您不应该隐藏父div，因为如果您隐藏父div，子div将被隐藏

您可以更改外部div的背景色

---

如果我理解正确，您希望隐藏外部div，但显示内部div

您不应该隐藏父div，因为如果您隐藏父div，子div将被隐藏

您可以更改外部div的背景色

---

不够：{溢出：隐藏}不够：{溢出：隐藏}

$('.innerDiv').animate({ left: '+=200px' });

$('.innerDiv').animate({left:'200px'}, {
complete: function () {
    $('.outerDiv').addClass('hide');
}
}
);