Recently I was playing around on my sandbox personal site with some ideas to dynamically move and position elements relative to on screen clicks in ways that are compatible with different browsers and different resolutions. The scripts I used to do this were then implemented by a fellow developer on a client’s site to solve a problem with having a customized pop-up div displaying at the correct location when clicking.
Note: Majority of the code was copied from several sources and thrown together and then modified to solve the problem. This is also done without the use of JQuery.
The process can be broken down into several steps.
- Find out which browser is being used and find the size of the client’s window.
- Find out where on the screen was clicked.