x和y位置查找器JQuery JS

Question

我有一個應該找到x和y位置的腳本。我可以在沒有任何問題的情況下找到x位置，但是我的y位置似乎是無窮大，我無法弄清楚原因。這裏是我的腳本

<script src="//code.jquery.com/jquery-1.10.2.js"></script> 
<script language"javascript" type"text/javascript"> 

$(document).ready(function(){ 
    $(".view_parent_furnace_boiler").droppable(); 
}); 

    $(document).ready(function() { 
    $(".device-container").draggable(
     { 
     grid: [10, 10], 
     containment: "#picture_container", 
     revert: 'invalid', 

     stop: function(){ 
($(".door").height()/100)+"%"); 

      var elementName = $(this).attr('name'); 
      console.log(elementName); 
      var elementID = $(this).attr('id'); 
      elementID = elementID.split(","); 
      var parent = $(this).parent(); 

     /*finding the x and y position percentage based on the container*/ 
      var yPosition = parseInt($(this).css('top'))/parent.height()*100; 
      var xPosition = parseInt($(this).css('left'))/parent.width()*100; 
      console.log(xPosition); //displays without anyproblem 
      console.log(yPosition); //does not work (infinity 
      /*assigning the div id to variable for further display and debugging purpose*/ 
      for (var k = 0; k < elementID.length; k++) { 
       var device_id = elementID[0]; 
       var command = elementID[1]; 
       var map_id = elementID[2]; 
      } 

      /*assigining values to variables*/ 

      $('#'+elementName+'-device_id').val(device_id); 
      $('#'+elementName+'-command').val(command); 
      $('#'+elementName+'-map_id').val(map_id); 
      $('#'+elementName+'-x_position').val(xPosition); 
      $('#'+elementName+'-y_position').val(yPosition); 

     }, 
     revert: 'invalid' 
    }); 
}); 
</script> 

這裏是我的CSS

<style type="text/css"> 
/* to display the boiler background picture*/ 
.view_parent_furnace_boiler { 
position: relative; 
    background-position: relative; 
    max-width: 100%; 
    max-height: 100%; 
    padding: 0em; 
    margin: 0em; 
    border-image-width: 5% 2em 10% auto; 
    border: 3px solid #ccc; 
    background:radial-gradient(circle, black, white); 
} 
.view_parent_furnace_boiler img { 
    max-width: auto; 
    max-height: auto; 
} 
.view_parent_furnace_boiler span { 
    color: #000; 
} 
.btn-inhibited{ 
    background-color:#aaa; 
    color:white; 
} 
.device-container { 
    position: absolute; /*could be relative*/ 
    cursor: move; 
} 
</style> 

Answer 1

嘗試使用jQuery $(this).offset().top或$(this).position().top代替$(this).css('top')。

https://api.jquery.com/position/

https://api.jquery.com/offset/

Answer 2

我想這var yPosition = parseInt($(this).css('top'))/parent.weight()*200;和它的工作完美，現在我可以找到我的身高100％沒有任何問題。