Question

这是编辑添加以下内容的问题.... 使用jquery动画对象简单如下.....

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

但如果不是左派，那将是理想的：＆＃39; 250＆＃39; px它可能是目标

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

所以这个问题与一些html有关，我在一个名为wrapper的div中有一个这个类....

<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;
}

班级的目的地＆＃34; logo＆＃34;是html页面的这一部分......

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

这个css样式带有类＆＃34; title-area-title＆＃34;根据a href链接......

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

}

我知道我可以使用一些非常酷的css3动画补间动画来将徽标移动到标签的位置。如果我使用的是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;

jquery动画将一个类移到div中

1 个答案: