从父右边获取位置，以％为单位

Question

Given a clientX coordinate, how can I determine how far that point is from the right edge of the parent container? I can do left edge correctly with

event.target.style.left = (((cX-event.target.parentNode.offsetLeft)) / event.target.parentNode.clientWidth)*100 +"%";

but can't seem to figure out the values to compare with, in relation to the right edge.. (edited)

or, actually, how far the right edge of event.target is from the right, since style.right positions from the right edge cX is the clientX of a JQuery UI draggable stop callback's event

Answer 1

Try using the getClientBoundingRect()

  function getPosition(e) {
      var rect = e.target.getBoundingClientRect();
      console.log(rect)
      var x =  Math.abs(e.clientX - rect.right);
      var y = e.clientY - rect.top;
      return {
        x,
        y,
        procent: x / (rect.width / 100)  
      }
   }

Example: https://jsfiddle.net/bogdanm/ocLn138v/