Trying to navigate the complex world of web development and facing a challenge that seems simple, yet tricky. Not quite sure how to properly refer to elements using HTML, Javascript and CSS.
In my HTML page, I have used divs as clickable objects styled with CSS. My goal is to create Page X as a standalone entity without always snapping to a specific point. However, I want to include links on another page that will allow users to smoothly transition to different areas on the page both vertically and horizontally (Moving to coordinates x,y on the page). This is similar to anchor links, but I need the object to be positioned at the center of the screen rather than just vertical scrolling like traditional anchors do.
I'm specifically looking for a solution where the object is not permanently centered, which has been the search result I keep finding online despite my efforts to find something else.
I attempted using HTML anchors but only managed to align them to the top right corner of the window, not the center as desired.
Despite believing there's a straightforward answer out there, I can't seem to crack it no matter how hard I try.
Edit: Managed to somewhat solve the issue by passing data through URLs and utilizing the scrollTo function, but still struggling to get the scrolled point perfectly centered on the screen.