CSS动画 - 纸张打开/关闭折叠

Question

我有动画流程来打开/关闭本文的问题。继承人我得到了什么 https://jsfiddle.net/upw1buds/3/

我有三个主要问题：

1. 图像在纸张完全打开之前扩展到div之外（但是在打开之后它应该是可见的，而不是在它之后显示）。那不是很好看。图像位于正确的位置。

2. 动画在Microsoft Edge上奇怪地起作用

3. 在关闭动画期间，右侧在缩小的同时扩展太远，我无法将其与收尾叶同步。

我认为问题就在这里

  $('.content').click(function(){
    $('.info-wrap').removeClass('info-wrap-open');
    setTimeout(function(){
      $('.tile').removeClass('info-bottom-front-opening');
    }, 310);
    setTimeout(function(){
      $('.info_bottom').removeClass('info_bottom_wider');
      $('.tile').removeClass('tile_opening');
    }, 450);
    setTimeout(function(){
      $('.content').removeClass('content_show');  
    }, 500);      
  });