So you want the bar to follow just the horizontal position of the cursor? Do you want the vertical position at the bottom of the image or the window?
Please explain further.

Update:
With version 1.3 you can now make the bar follow a single axis of the cursor. To align to bottom of window, add this to your CSS style:
top: auto; bottom: 10px;

example of left side alignment:
left: 5px;

I have also added a way to change the bar's relative position to the cursor. So you could instead move it away from other tooltips.

The Over, Before, and After image modes all add the bar inside the page and are affected by the sites layout and styles. So there is no way to adapt to every site.

Update:
Thanks for the feedback.

To avoid scaling the bar on page zoom you could use: vw, wh, wmin, or vmax units instead of px or %, to scale to the size of the browser window. for example:
font: 1.8vw arial black, sans-serif; top: auto; bottom: 4vh;
For more info see: https://www.w3schools.com/CSSref/css_units.asp