Question

在这里，我创建了jsFiddle哪种复制我的问题

动画完成后（单击MOVE两次），固定列返回错误的位置。

是否可以在不使用left或right固定定位元素的情况下为我设置动画？

Answer 1

更新了jsfiddle http://jsfiddle.net/z8fBD/7/

Trick是在#body

上添加重置翻译

#body {
    position:absolute;
    left: 0;
    top:0;
    width: 200px;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
    -webkit-transform: translate(0%,0px);
    -moz-transform: translate(0%,0px);
    -ms-transform: translate(0%,0px);
    -o-transform: translate(0%,0px);
    transform: translate(0%,0px);
}

Answer 2

您必须将margin:0px和padding:0px添加到<body>，因为位置：固定lead element at top`而不考虑填充和文档边距。

请在这里查看 JsFiddle Demo

Answer 3

删除“position：fixed;”来自#fixed样式，它工作正常......

动画CSS后固定元素位置错误

3 个答案: