无法获取Div的位置动画

Question

我想在bottom链接click动画上一个div到的3px如果位置已经30％和上升，如果是3px的后。

$(document).ready(function() { 

    $('#picsClick').click(function() { 

     if ($('#mainLogo').position().bottom === '30%') { 
      $("#mainMenu").animate({ bottom: "3px" }, 1100); 
     } 
     else if (($('#mainLogo').position().bottom === '3px')) { 
      $("#mainMenu").animate({ bottom: "30%" }, 1100); 

     } 

    }); 
}); 

不知怎的，它不运行，因为我已经设置MAINMENU div位置bottom30％，它的位置是absolute。
谢谢。

Answer 1

position（）返回的对象只包含left和top属性。所以底部是和未知的属性，因此你的代码失败。请致电jQuery documentation。

Answer 2

jquery position API确实给出了一个元素的坐标。 X和Y--这对你来说意味着顶部和左边。你需要重构你的逻辑。即使你这样做后，你应该注意返回的值是数字 - 绝对值基于你的元素位置w.r.t页面的尺寸。你不能指望百分比。因此你的比较逻辑也会改变。

例如，如果这是你的元素：

<input type="text" id="inpId" name="address" value="* Property Address :" style="top: 30%; position: absolute; "> 
console.log(typeof $('#inpId').position()['top']) // "number" 
console.log(typeof $('#inpId').position()['bottom']) // "undefined" 

见jquery position

编辑：以围绕着底部你的逻辑，你需要计算同在顶部的条款。看到这个问题：

Get bottom and right position of an element

希望它能帮助:)