所以我有一个带有以下css的div:
#MyDiv {
position: absolute;
overflow: visible;
top: 0px;
right: 50%;
width: 49%;
height: 99%;
min-width: 250px;
min-height: 400px;
max-width: 400px;
max-height: 500px;
background-color: #FFFFFF;
border: 1px solid #000000;
margin: 0 auto;
padding: 0px;
}
我正在使用jquery 800像素向右移动它。在firefox中,最终位置是理想的位置,但是在chrome和opera中它是错误的。
alert($("#MyDiv").position().left);
$("#MyDiv").animate({left: "+=" + 800 + "px"}, 1000, "linear", function() {
alert($("#MyDiv").position().left);
});
在firefox中,初始左侧位置为23(第一个警报),最后一个823(第二个警报) 在chrome和opera中,最终位置是800
我做错了什么?需要保持css不变。P.S。 ie8也有一些问题,但程度低于铬和歌剧
提前感谢。
编辑 jsfiddle:http://jsfiddle.net/Q8K2R/
答案 0 :(得分:1)
其他方法是设置css left
属性,因为动画与css一起工作,并且这里没有保证,左边的属性包含正确的计算数据,所以修复可以像
var mydiv=$("#MyDiv");
mydiv.css({left: mydiv.position().left});
在动画之前 DEMO
答案 1 :(得分:0)
为什么不在动画风格之前计算位置:
`var _left = $("#MyDiv").position().left + 800 + 'px';
$("#MyDiv").animate({left: _left}, 1000, "linear", function() {
alert($("#MyDiv").position().left);
}); `