How to calculate position for div with absolute when browser window change width

Question

I have img and div under it with position absolute. So I need that this div always start from bottom right corner of image and go to left. But div gets off from img bottom corner after resize browser window when I use this code :

div1.style.left = ((imgRect.left + 
  (window.pageXOffset || document.body.scrollLeft) - 
  (document.body.clientLeft || 0)) 
  - 532) + "px";

Note that div take correct position when refresh the page, but how to do this without refreshing?

I try to add this code:

$(window).resize(function () { 
  div1.style.left = ((imgRect.left + 
    (window.pageXOffset || document.body.scrollLeft) - 
    (document.body.clientLeft || 0)) 
    - 532) + "px";
});

but still have same result. I guess it is not a correct calculation.

Answer 1

There's plenty wrong with your code, but the bit that's causing your code not to work is the div1 variable is likely inaccessible within the resize callback. Ensure div1 is available within the function and you should be good to go.