アニメーションJS/jQueryの機能は、私はアニメーションのdivの位置を変更し、そのが動作していない機能をやってみたかった

Question

動作しません:(

$(document).ready(function() { 
function moveAnimate(x, y, element) { 
    var leftX = document.getElementById.style.left; 
    var topY = document.getElementById.style.top; 
     leftX += x 
     topY += y 
      $('"#"+element').animate(
      { 
       "top": "topY", 
       "left": "leftX", 
      }, 
      1000); 

}; 
}); 

私は関数と呼ば：

<div id="divv" onclick="moveAnimate(300, 400, divv)"></div> 

Answer 1

はあなたのコードをチェックしてください好きなはずです

var leftX = document.getElementById(element).style.left; 
var topY = document.getElementById(element).style.top; 

と機能をアニメーション：。それがなければならないので、JSの構文は再びのdocument.getElementByIdメソッドですこの：

$('#'+element).animate({ 
    //your code here 
}) 

Answer 2

あなたmoveAnimateは$(document).ready(function() {})範囲内で定義されています。
ただし、グローバルコンテキストから呼び出そうとします。

onclick属性で利用できるようにするには、あなたの関数を$(document).readyの外に定義する必要があります。
はるかに良い、ハンドラをアタッチするjQuery.on('click')を使用します。私はまた、あなたのmoveAnimate機能にいくつかの構文と論理エラーを修正した

function moveAnimate(x, y, element) { 
    var leftX = document.getElementById.style.left; 
    var topY = document.getElementById.style.top; 

    leftX += x; 
    topY += y; 

    $(element).animate({ 
     "top": topY, 
     "left": leftX, 
    }, 1000);  
}; 

$(document).ready(function() { 
    $("#divv").on("click", function() { 
     moveAnimate(300, 400, this); 
    }); 
}); 

注意を。

Answer 3

あなたのコードが間違っている、私はいくつかの変更を加えました：

function moveAnimate(x, y, element) { 
    var leftX = document.getElementById(element).style.left; 
    var topY = document.getElementById(element).style.top; 
    leftX += x; 
    topY += y; 
    $('#'+element).animate(
    { 
     "top": leftX, 
     "left": topY, 
    }, 
    1000); 

}; 

あなたはドキュメントを読んでください...