从其位置而不是页面的cordenades动画图像位置

Question

$('#container img')
                .clone()
                .appendTo('#container')
                .css({'position' : 'absolute','z-index':9999,marginLeft:-100})
                .animate({opacity: 0.1, left: 200,top:200,height:420}, 1000, function() {
                    $(this).remove();
                     actualizar(iGal);

            }); 

Basicalli我想把它移动200px到左边,200到底部,但是它会被移动到页面cordenade 200px左边和200px底部,

.css({'position','relative'});

相反,但是这个位置没有被瞄准,

我错过了什么？我必须用胶印做吗？

Answer 1

您可以使用

...
.animate({opacity: 0.1, left: "+=200",top:"+=200",height:420}, 1000, function() {
...

然后你向x和y轴添加200px

或者您可以先检测到偏移量:

var offset = {
    x: $('#container img').offset().left,
    y: $('#container img').offset().top
};

...
.animate({opacity: 0.1, left: offset.x+200,top: offset.y+200,height:420}, 1000, function() {
...

jQuery offset函数返回浏览器窗口左上角的偏移量.还有另一个函数调用position,它确定第一个父元素的偏移量为position relative或absolute.

http://jsfiddle.net/UDb7V/