redirecting to url in certain div

Question

is it possible to redirect to URL in certain div

like

<div id="id45">
<! -- redirect to url if reached to this div content -->
</div>

So you would add a scroll event listener and detect if the element is in the viewport. Seems odd , but doable. — epascarello, Mar 29 '21 at 14:15
https://stackoverflow.com/questions/123999/how-can-i-tell-if-a-dom-element-is-visible-in-the-current-viewport — epascarello, Mar 29 '21 at 14:17

score 0 · Answer 1 · answered Apr 13 '21 at 17:45

You can do it for example this way:

function myFunction() {
  if (window.innerHeight + window.scrollY >= document.getElementById("id45").offsetTop) {
      window.open("https://www.example.com");
      window.removeEventListener("scroll", myFunction);
    }
}

window.addEventListener("scroll", myFunction);

<div style="width: 100%; height: 110vw; background-color: lightBlue;"></div>

<div id="id45" style="width: 100%; height: 100px; background-color: red;">
<! -- redirect to url if reached to this div content -->
</div>

For me it works but not in this Stackoverflow´s snippet. It gets height of full browsers window, but if you copy it to your website, I hope it will work.

Note: my browser blocked this window from opening, but it is normal, as said here.

redirecting to url in certain div

1 Answers1