jQuery動畫將一個類移到div內

Question

這是對問題的編輯，以添加以下內容。

$("div").animate({left: '250px'});

但是，如果不是左撇子，那么它可能是理想的選擇：'250'px

div/class something like this....
$("div").animate({'.title-area-main'});

所以這個問題與html有關，我在div中有一個此類稱為wrapper...。

<div class="logo"><img src="images/mthc/logo-main.png" height="150px" width="420px"></div>

在CSS中定義為...。

#wrapper {
left: 50%;
  top: 50%;
  width:720px;
  height:300px;
  position:fixed;
  margin-top: -50px;
  margin-left: -100px;
  transform: translate(-25%, -25%);
  z-index : 5001;
}
.logo{

  float:left;
  width:60%; 
  z-index : 5005;
}

類“徽標”的目的地是html頁面的這一部分。

 <a href="index.html" class="tile-area-title fg-white small" alt="musability logo"><img src="images/mthc/logo.png"></a>

並且css樣式帶有href鏈接中的類“ title-area-title”。

.metro .tile-area .tile-area-title {
  position: fixed;
  top: 0;
  left: 260px;
  border: 0 ;
  height: 120px;
  width: 800px;

}

我知道我可以使用一些非常酷的css3動畫補間來將徽標移到a標簽的位置。 如果我使用的Internet Explorer版本是50000，那就太好了... 所以我基本上是在尋找一種做到這一點的jquery方式，目前甚至沒有jquery動畫的經驗。 任何建議都會非常有幫助。

Answer 1

獲取元素的位置：

   function getPosition(element) {
            var xPosition = 0;
            var yPosition = 0;

            while (element) {
                xPosition += (element.offsetLeft - element.scrollLeft + element.clientLeft);
                yPosition += (element.offsetTop - element.scrollTop + element.clientTop);
                element = element.offsetParent;
            }
            return { x: xPosition, y: yPosition };
        }

然后，您可以這樣稱呼它：

 var y = getPosition(document.getElementById('mydivID')).y;
 var x = getPosition(document.getElementById('mydivID')).x;