在Internet Explorer 11和Edge中移动到transform: translatex(-100%);的容器transform: translatex(0);无法正常工作。内容移动但是当触摸鼠标时它会返回。
.widget {
position: fixed;
top: 0;
bottom: 0;
margin: auto;
background-color: #fff;
border-radius: 4px;
transition: all 1.5s;
max-height: 400px;
left: 0;
transform: translatex(-100%);
}
.widget:hover {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
transform: translatex(0);
}