Javascript 垂直和水平展开Div并设置其动画

我试图使它，使我的旋转木马滑块内的div将切换和扩大到一个更大的div，将适合在旋转木马点击和重置新的div内容。我所看到的所有正在扩展的div只会下滑，而旧的div信息仍然存在

这是我发现的唯一一个JavaScript，但我不知道如何在扩展时将其应用于新的div信息

$("#expand").click(function(){
    $(".article-container").animate({
        width: "100px",
        height: "100px",
        top: "-50px",
        left: "-50px",
        opacity: 0.6,
    }, 1500 );
});

以下是容器在展开之前和之后的CSS

.article-container{
    float: left;
    width: 193px;
    height: 360px;
    margin: 0 13px 0 0;
}

.article-container-expand{
    float: left;
    width: 500px;
    height: 1000px;
    margin: 0 13px 0 0;
}

---

如果要在动画之后应用数据更改，则需要为动画调用指定完成回调：

$("#expand").click(function(){
  $(".article-container").animate({
      width: "100px",
      height: "100px",
      top: "-50px",
      left: "-50px",
      opacity: 0.6,
    }, 
    { duration: 1500,
      complete: function() {
        // update the content here
        // this is the item being animated
      }
    }
  );
});

---

看看

嗨，看看这里-这应该会有帮助：（看看所有东西是如何组合在一起的）干杯，这太棒了！我添加了jquery脚本以及所有CSS、HTML和JavaScript，但我仍然无法在自己的文件中实现动画。我忘了添加其他脚本了吗？谢谢。你好，不用担心：）很高兴这有帮助，okies，嗯，你能在JSFIDLE中重新创建你的问题吗？或者我希望您的页面中包含查询库，请尝试查询警报（'foo'）；或者别的什么，看看有没有警报？